为什么我的arcTween回调在更新期间没有被调用

时间:2018-02-21 08:43:57

标签: javascript d3.js

我使用d3渲染圆环图组件。下面是渲染代码。问题是转换后没有调用arcTween回调。我使用_current作为更新此组件数据的中间值。

const pie = d3
      .pie()
      .sort(null)
      .value(d => {
        return d.dataPerc;
      });

    const arcTween = d => {
      const i = d3.interpolate(this._current, d);
      this._current = i(0);
      return t => {
        return arc(i(t));
      };
    };
    if (this.dataset.length <= 0) {
      return;
    }
    const data1 = pie(this.dataset[0]);
    this.path = this.path.data(data1);

    const that = this;
    this.path
      .enter()
      .append('path')
      .each(d => {
        this._current = {
          startAngle: d.endAngle,
          endAngle: d.endAngle,
        };
      })
      .style('fill', d => {
        return d.data.color;
      })

    this.path
      .exit()
      .datum(d => {
        return {
          startAngle: d.endAngle,
          endAngle: d.endAngle,
        };
      })
      .transition()
      .duration(1000)
      .attrTween('d', arcTween)
      .remove();

    this.path
      .transition()
      .duration(1000)
      .attrTween('d', arcTween);

0 个答案:

没有答案