Viz

var data = [10, 5, 12, 15, 22, 11];
var maximum = data.reduce(function(a, b) {
return Math.max(a, b);
});

var width = 30 * maximum, scaleFactor = 20, barHeight = 50;
var barColor = “green”;

var graph = d3.select(“#graph”)
.append(“svg”).attr(“width”, width)
.attr(“height”, barHeight * data.length);

var bar = graph.selectAll(“g”)
.data(data)
.enter()
.append(“g”)
.attr(“transform”, function(d, i) {
return “translate(0,” + i * barHeight + “)”;
});

bar.append(“rect”).attr(“width”, function(d) {
return d * scaleFactor;
}).attr(“height”, barHeight – 2)
.style(“fill”, barColor);
bar.append(“text”)
.attr(“x”, function(d) { return (d*scaleFactor); })
.attr(“y”, barHeight/2)
.attr(“dy”, “.35em”)
.text(function(d) { return d; });