使用jQuery为arc / pie D3.js图中的几个更改事件设置动画

Question

我和D3在同一条船上，试图进入下一个级别。我有一个接近我想要的图表，但我无法弄清楚如何动画变化。有许多事件，并将不同的部分放在不同的功能中。如果出现以下情况，我会使用以下内容调用它们：

 if ($("#chart1Pie").is(":checked")) {
    updateOne();
    } else if ($("#chart2Pie").is(":checked")) {
        updateTwo();
    };

通过将不同的部件放在不同的功能中，我有错吗？完整的代码在jsfiddle上。

http://jsfiddle.net/rocky1616/ghfqmygh/

Answer 1

您使用的D3绝对不正确。你有一个图表，但有两组数据 - 史密斯和琼斯。您不需要使用jQuery删除#chart中的内容，然后从头开始重建整个图形。通常，如果要删除和添加元素，则应使用D3方法.enter（）和.exit（）。

在您的情况下，不需要删除任何内容。您需要在更新时执行的操作是重新计算路径的属性“d”。

请查看以下示例：one，two。