d3.js chart not updated with new data

Viewed 9596

A series of rectangles are plotted using d3.js by fetching an array of 100 objects. Although the console.log(data) shows that new data are being retrieved, the new data points do not seem to be appending any rectangles.

Was .enter().append() used incorrectly?

function init() {
    var width = 800,
        height = 400,
        margin = 50;

    chart = d3.select('#chart')
                .append('svg:svg')
                .attr('width', width)
                .attr('height', height);
}

function do_update() {
    data = fetch_latest_top100();
    console.log(data)

    chart.selectAll('rect')
        .data(data)
        .enter()
        .append('svg:rect')
        .attr('x', function(d) { return x(d.x); })
        .attr('y', function(d) { return y(d.y); })
        .attr('height', function(d) { return d.value; })
        .attr('width', function(d) { return 3 });
}

jsfiddle: http://jsfiddle.net/BU8cA/

1 Answers
Related