Question

我正在使用d3在页面上绘制矩形网格。

有一个数组可以确定网格中每个单元格的颜色。有时，更新此数组的元素以更改其颜色。

是否有d3模式或方法只能更改特定元素？我有一个渲染函数，它在d3中重新渲染整个网格，但是当只有少数单元格改变颜色时，我不想迭代（并更改填充）每个rect元素，因为可能有数千个单元格。

Answer 1

我刚刚查看了源代码，似乎没有。如果性能存在问题，我会在每次.enter来电时执行的操作是通过设置自定义.attr('data-lastColor')来跟踪任何更改。在此之后的每次.data更新调用中，我都会

.data(dataSet)
.attr('color', function(d){ 
    var theElement = d3(this);
    var newColor;

    //set the new color here, under whatever conditions you want
    if (foo==bar) { 
        newColor = 'green' 
    } else {
        newColor = 'red'
    } 

    if theElement.attr('data-lastColor') != newColor {
        theElement.attr('color') = newColor;
        theElement.attr('data-lastColor') = newColor;
    } else {
        //Don't do anything if the new color is the same as this color, saving valuable computing time
    }
})

很抱歉，如果答案有点粗糙，但它应该做你想做的事情：）

仅使用d3修改已更改的元素

1 个答案: