ES6 中的 D3.js 饼图补间 - 未捕获的类型错误

Question

我尝试使用动画创建基于 D3.js 和 ES6 的我自己的饼图库。

这是我的代码：

class PieChart{

    constructor(element, options) {

        Object.assign(this, Piedefaults, options);

        this.element = element;

        this.init();

    }

    init(){

        const [ innerWidth, innerHeight, innerRadius, outerRadius ] = this.dimensions();

        const createGradient = select => {

            const gradient = select.select('defs').append('linearGradient').attr('id', 'gradient-pie').attr('x1', '0%').attr('y1', '100%').attr('x2', '0%').attr('y2', '0%');

            gradient.append('stop').attr('offset', '0%').attr('style', 'stop-color:#fa6293;stop-opacity:1');

            gradient.append('stop').attr('offset', '100%').attr('style', 'stop-color:#ffa77f;stop-opacity:1');

        }

        const arc = this.arc = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius).startAngle(0).cornerRadius(20);

        const chart = this.chart = d3.select(this.element).append('svg').attr('width', this.width).attr('height', this.height).append('g').attr('transform', `translate(${innerWidth/2}, ${innerHeight/2})`);

        chart.append('defs');

        chart.call(createGradient);

        const background = this.background = chart.append('path').datum({endAngle : Math.PI*2}).attr('class', 'background').attr('d', arc);

        const foreground = this.foreground = chart.append('path').datum({endAngle : 0}).attr('class', 'foreground').attr('fill', 'url(#gradient-pie)').attr('d', arc);

    }

    dimensions() {

        return [this.width, this.height, this.radius, this.radius-this.thickness];

    }

我的问题是绘制饼图需要一些补间函数来动画饼图，我得到了这个arcTween方法：

未捕获的类型错误：无法读取未定义的属性“弧”

并且无法解决问题。任何形式的帮助表示赞赏:)