我用d3和svg构建饼图。我在svg路径的d属性上使用转换来为饼图中的更改设置动画。除非弧的目标尺寸>≥180°，否则是按预期工作。然后在过渡期间，弧形路径是不可见的。
示范：http://jsbin.com/EXeXUXE/4/edit
我认为这是因为d3在转换期间产生了无效的路径信息：
Error: Problem parsing d="M1.4082973068957338e-14,-230A230,230 0 0.0000013720000000000002,1 135.1904225457546,186.07396897283516L0,0Z"
我做错了吗？这是一个错误，有没有办法工作？
由于
答案 0 :(得分：10)
这里的问题是d3.svg.arc()使用A SVG路径命令绘制椭圆弧。该命令的格式如下。
A (rx ry x-axis-rotation large-arc-flag sweep-flag x y)+
各个参数的含义并不重要，这里唯一相关的是large-arc-flag和sweep-flag。根据{{3}}
- 在四个候选弧扫描中，两个将表示大于或等于180度的弧扫描（“大弧”），两个将表示小于或等于180度的弧扫描（ “小弧”）。如果大弧标志为'1'，则将选择两个较大的弧扫描中的一个;否则，如果large-arc-flag为'0'，将选择一个较小的弧扫描，
- 如果sweep-flag为'1'，那么弧将以“正角”方向绘制（即椭圆公式x = cx + rx * cos（theta）和y = cy + ry * sin评估θ，使得theta以对应于当前点的角度开始并且积极地增加直到弧到达（x，y））。值为0会导致弧以“负角度”方向绘制（即，θ以对应于当前点的角度值开始并减小，直到弧到达（x，y））。
正如他们的名字所示，这些是标志，即0/1值。这是d3.svg.arc()生成的内容。但是，当使用.transition()和默认路径补间在它们之间进行插值时，D3会将它们解释为数值而不是标记。对于这些标志，中间路径的值将介于0和1之间，这是非法的。正因为如此，解析失败了。
要修复，请使用自定义补间（无论如何都需要用于径向路径）。参见例如SVG spec示例了解如何操作。