javascript - 弧线笔划线弹出后的画布

Question

我正在使用 Canvas，当我像围绕弧线一样绘制笔触时，我看到笔触线出现：

渲染圆圈功能：

function renderCircle(radius, angle, circleLength, circleAngle, circleColor, circleBorderColor, circleTextColor, circleFontStyle, value) {
var text = "$" + (typeof value === "number" ? value : this.data.value);
        var coord = this.getCoordOnCircle(radius * 1.21, angle);
        var circlePoint = {
            x: this.gaugeCenterX - coord.x,
            y: this.gaugeCenterY - coord.y
        };
        var ctx = this.ctx;
        ctx.fillStyle = circleColor;
        ctx.beginPath();
        ctx.moveTo(circlePoint.x, circlePoint.y);
        coord = this.getCoordOnCircle(circleLength * 1.18, angle - circleAngle);
        ctx.arc((circlePoint.x + coord.x), (circlePoint.y + coord.y), circleLength, 0, 25 * Math.PI);
        ctx.strokeStyle = circleBorderColor;
        if(this.isAnimationEnabled) {
         ctx.lineWidth = 2;
        }

        ctx.stroke();
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = circleTextColor;
        ctx.textAlign = 'center';
        ctx.font = circleFontStyle;
        ctx.fillText(text, (circlePoint.x + coord.x), (circlePoint.y + coord.y) + 5);
}

你可以看到这里的蓝线稍微出来了。有人知道为什么会这样吗？

标签： javascripthtmlcsscanvashtml5-canvas

Answer 1

解决了，我很愚蠢地添加了 ctx.moveTo(circlePoint.x, circlePoint.y);

我删除了它并修复了