Question

我使用React可视化大型数据集，并将数据集作为JSON发送到React类：

如何让D3仅重绘已更改的内容（一个数据集）？我可以将静态曲线绘制为静态元素，但我希望D3为我处理这个问题，以便我的代码具有更大的灵活性。

注意：我尝试使用 key 部分中的.data(dataset, key)，但这并未对数据集中的更改做出响应。

代码：

var el = this.getDOMNode(); // for React
var SVG = d3.select(el).append("svg");
SVG.append('g')
 .attr('class', 'newSelection');

var g = d3.select(el).selectAll('.newSelection')
var line = d3.svg.line() // send arrays with [y,x] to this function to create lines
    .x(function(d){
        return scales.x(d[1])
    })
    .y(function(d){
        return scales.y(d[0])
    })
    .interpolate("basis");

var graphdata = this.props.graphdata; //to get data from React class

var lines = g.selectAll('.newSelection')
        .data(graphdata); 
    //enter
lines.enter()
    .append('g') // for me to recognize the paths
    .attr('class', function(d){
        return ('path '+d.Title)
    })
    .append('path')
    .attr('id', function(d){
        return d.Title
    })
    .attr('d', function(d){
        return line(d.data)})
    .attr('stroke-width',2)
    .attr('stroke','blue')
    .attr('fill', 'none');
// exit
lines.exit().remove();

是的，我对D3来说相对较新。

D3.js创建类似数据集

0 个答案: