如何固定d3可缩放的太阳爆发过渡

Question

我用以下网站的参考创建了一个可缩放的日冕。http://bl.ocks.org/mbostock/4348373

问题是我在最后一个关卡中有很多弧线，即最外层的环(近2000个弧线)，这减慢了点击时太阳爆发的过渡。

我试图固定这个过程的一种方法是，只有当用户潜入太阳爆发(点击任何子弧)时，才显示最外层的弧。如果最外面的弧是第四个同心圆。

当用户选择级别2/3时显示。

我创建了初始数据集，将最外层的弧的大小设置为0。点击时，我写了一个函数将大小设置为1。然而，它不起作用。下面是链接http://jsfiddle.net/Claw_22/1400rdu0/6/

function sizeFunc(data){
  if (!data.children) {
    if (data.level=="3") {
      data.size="1";
    }
  }
  else {
    for (i=0;i<data.children.length;i++) {
      sizeFunc(data.children[i]);
    }
  }
}

请告诉我如何才能做到这一点。(实现更快性能的替代解决方案也很有帮助。)

Answer 1

在单击功能中可以将过渡时间设置为最小值。比如下面的

function click(d) {
path.transition()
  .duration(100) //sets the delay in transition
  .attrTween("d", arcTween(d));}