2

我试图弄清楚如何在 ag 元素中转换绑定到相同数据的路径和文本。

这个要点显示了我想要的行为。当您单击更改按钮时，路径和文本位置会平滑过渡。问题是我通过将路径和文本元素分别加入数据来实现这一点。 我不是唯一一个以这种方式使用 join 的人，但我认为它违反了使用 d3 维护元素和数据之间的一对一映射的目标。

有没有办法模仿

var path = svg.selectAll("path")
     .data(dataset);

path
    .enter().append("path")
    .attr("d", function(d) { return line(d.values) + "Z"; })
    .style("fill", function(d, i) { return color(i); });

path
    .transition().duration(500)
    .attr("d", function(d) { return line(d.values) + "Z"; });

path
    .exit().remove();

链接到ag元素中相同数据的元素的模式？

这是我失败的尝试之一。更改按钮不会更新路径和文本，而是会导致添加新的 g 元素。

编辑时添加：更正 explunit 发现的错字后，失败的尝试现在有效

4

1 回答 1

2

您在加入时的班级名称中有错字。这段代码：

var g = svg.selectAll(".shapes")
    .data(dataset);

应该是这样的：

var g = svg.selectAll(".shape")
    .data(dataset);

当我按上述方式更改它时，它对我来说很好。

于 2013-03-12T16:22:51.803 回答