d3.js使用转换关闭弧（圆环）不会按预期运行

Question

我正试图关闭一个圆弧，将它变成一个圆环，使用一个转换，它会在一秒钟内完成。

如果我不使用过渡，则两端都会没有故障。但是，使用transition（），当一端接触另一端时，形状变为实心圆，向左移动，然后返回到右边坐标上的圆环。

为什么会发生这种情况，我该如何避免呢？

这是创建圆圈的部分：

        this.arcSvg = d3.svg.arc()
        .innerRadius(200)
        .outerRadius(250)
        .startAngle(function(context) {
            var self = context;
            return function(d) {
                return self.scale(d.start) * Math.PI;
            };
        }(this))
        .endAngle(function(context) {
            var self = context;
            return function(d) {
                return self.scale(d.end) * Math.PI;
            };
        }(this));


    this.arc = this.graph.selectAll("path")
        .data(this.data)
        .enter().append("path")
        .attr("d", this.arcSvg);

以下是执行更新和转换的部分：

        this.data = data;
        this.arc.transition().ease("linear").attr("d", this.arcSvg);