d3带有附加文本的动画路径

时间:2013-06-26 12:30:14

标签: d3.js path label transition sunburst-diagram

我按照http://strongriley.github.io/d3/ex/sunburst.html上的例子创建了一个旭日图表:

enter image description here

一切都很好,当将文本附加到图表时(通过text和textPath元素使用指向弧的ID的xlink:href属性)。在没有附加文本的情况下动画(打开/关闭效果)图表时(如示例所示)。只要文本被附加,但动画减慢(拖动行为)。这仅在iPad上发生,而在桌面上不发生。我认为这是因为平板电脑的webkit。也许我错过了什么。

注意:由于文本附加到圆弧,因此不会对文本元素应用任何过渡,只有使用以下内容对路径进行动画处理:

path
  .data(partition.value(val))
  .transition().duration(1500).attrTween("d", arcTween);

使用此方法,路径上的文本(附加)可以在网络上平滑动画,但不能在iPad上动画。

0 个答案:

没有答案