d3 update data and update graph

后端 未结 1 1166
小蘑菇
小蘑菇 2021-02-01 14:39

I have the following simple line in d3 but haven\'t an issue trying to figure out how to pass it data2 and update the line to reflect the change.



        
相关标签:
1条回答
  • 2021-02-01 15:33

    I am new to D3 but this is what I have found and I mainly figured this out from the sparklines example here.

    Instead of drawing the line with this code:

    vis.selectAll('path.line')
        .data([data])
        .enter()
        .append("svg:path")
        .attr("d", d3.svg.line().x(function(d, i) {return x(i); }).y(y));
    

    generate the line separately:

     var line = d3.svg.line().x(function(d, i) { return x(i); }).y(y)
    

    Then apply it to the data:

    vis.selectAll('path.line')
        .data([data])
        .enter()
        .append("svg:path")
        .attr("d", line);
    

    Then when you want to update the data you call:

     vis.selectAll("path")
       .data([data]) // set the new data
       .attr("d", line); // apply the new data values
    

    The sparklines example also shows you how to animate it :)

    0 讨论(0)
提交回复
热议问题