Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
var ann,
bar,
chart,
g,
gBar,
gEnter,
gRule,
line,
rects,
rule,
svg,
svgSelect,
text,
wrapper,
x,
debug;
debug = true;
// Define scales
x = d3.scaleLinear()
.domain([0, d3.max(data.map(function (d) { return +d.count; }))])
.range([0, 285]);
// Select svg container and join data
wrapper = d3.select(this).selectAll('svg').data([data]);
// Set height (change to dynamic)
height = 600;
svg = wrapper.enter().append('svg')
.classed('chart', true)
svgSelect = d3.select('.chart')
.attr('width', width)
.attr('height', height)
// Data Join
rects = svgSelect.selectAll("rect")
.data(data)
// Enter and Update
rects.enter().append("rect")
.attr("transform", function(d, i) { return "translate(0," + i * 25 + ")"; })
.attr("height", 25 - 1)
.merge(rects)
.attr("width", function(d) { return x(+d.count); })
// Exit
rects.exit().remove();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.