过渡分区弧回到原来的角度

Question

如何在使用 d3.layout.partition 时将最初由 d3.svg.arc() 定义的弧角转换回其原始值？

我正在尝试将初始 startAngle 和 endAngle 值 d.x 和 d.dx 存储在某处，以便我可以在以后的状态下转换回它们。但是，我不知道：

d.x 和 d.dx 在什么时候初始化，无论是在 d3.svg.arc() 中还是在实际附加弧路径时。
当我使用分区渲染它们时，如何将 d.x 和 d.dx 绑定到元素。

通常我可能会将初始 startAngle 和 endAngle 绑定到具有 datum() 的元素。我相信我正在寻找类似的东西：

selectAll('path').data(function(d) {
    return partition.values({
            'initialStart': d.x,
            'initialEnd': d.dx
        }).nodes(d)
    });

Answer 1

原则上这与 transitioning pie charts 相同，您需要一个自定义补间函数来获得正确的动画效果。为此，有必要将原始值保存在单独的属性中——在您的情况下，您可以做同样的事情。

布局为运行时设置属性；这完全独立于 DOM.

的呈现和附加元素

过渡分区弧回到原来的角度

Transition partition arcs back to original angles

d3.js

transition