javascript - d3 进入/追加/退出/删除序列仅追加

Question

最初使用以下进入/追加/退出/删除顺序绘制一组矩形，没问题。当我传递不同的数据（旨在完全替换现有数据）时，新矩形将绘制在现有矩形之上。

我选择“lgnds”而不是 rect，因为我已经绘制了其他不想打扰的矩形。

var svg = d3.select("#graph").append("svg")

elements = svg
    .selectAll("lgnds")
    .data(data, function(d){return d;});

elements
    .enter()
    .append("rect")
    .attr("width", 15)
    .attr("height", rectHeight)
    .attr("x", 5)
    .attr("y", function (d,i){return ((i*rectHeight)+(gap*(i+1)));})
    .style("fill", function(d){ return d.color;});

elements
    .exit()
    .remove();