Stacked Bar Chart Setup

_.md

[ Launch: Stacked Bar Chart Setup ] dc0855e342ab159f19c0 by delenamalan
[ Launch: Stacked Bar Chart Example ] 6264539 by lewis500
[ Launch: Stacked Bar Chart Example ] 6264512 by lewis500
No parent Inlet

config.json

{"description":"Stacked Bar Chart Setup","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"inlet.svg":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"editor_editor":{"coffee":false,"vim":false,"emacs":false,"width":579,"height":573,"hide":false},"thumbnail":"http://i.imgur.com/zleU5Kw.png","ajax-caching":true}

inlet.js

var svg = d3.select("svg");
var data = [
  [{y:21},{y:10},{y:10},{y:38},{y:20}],
  [{y:14},{y:25},{y:21},{y:10},{y:10}],
  [{y:14},{y:35},{y:21},{y:10},{y:4}]
];

var height = 416;

svg.append("g").append("rect").attr({
  x : 5,
  y : 5,
  width: 10,
  height: 10
})
.style(fill, "#3f3f3f");

//make a color scale, stackify the data, then draw the rects on a group you can translate around
var stack = d3.layout.stack();
stack(data);

var ymax = d3.max(data, function(d) {
  return d3.max(d, function(v) {
    return v.y + v.y0;
  })
});

var x = d3.scale.ordinal()
	.domain([0, data.length])
    .rangeRoundPoints([0,20], 0.2);

var y = d3.scale.linear()
.domain([0, ymax])
.range([0, height]);

var colorScale = d3.scale.category10();

var g = svg.append("g")
	.attr("transform", "translate(50, 50)");

var layers = d3.selectAll(".layer")
  .data(data)
  .enter()
  .append("g")
  .classed("layer")
  .style("fill", function (d, i) {
    return colorScale(i);
  });

var barWidth = 5;

var stacks = layers.selectAll("rects")
.data(function(d) {return d;})
.enter()
.append("rect")
.attr({
  "width" : barWidth,
  "height": function(d) { return y(d.y); },
  "x": function(d, i) { return x(i); },
  "y": function(d) { return  y(d.y0); }
});

inlet.svg