画架动画结束弧的角度答案

【问题标题】：easeljs animate endAngle of arc画架动画结束弧的角度
【发布时间】：2023-03-22 07:11:01
【问题描述】：

使用 easeljs 如何为弧的 endAngle 设置动画

我尝试通过 pie.setMyAngle = 0.1; 创建自己的属性，然后在刻度中增加它，但没有奏效

function init() {

    var canvas = document.getElementById('easel');
    var stage = new createjs.Stage(canvas);

    var pie = new createjs.Shape();
    pie.setMyAngle = 0.1;
    pie.graphics.beginFill("rgba(255,255,255,1)").arc(75, 75, 75, 0, Math.PI * pie.setMyAngle, false).lineTo(75, 75).closePath();

    stage.addChild(pie);

    createjs.Ticker.addEventListener("tick", handleTick);

    function handleTick() {
        pie.setMyAngle += 0.1; //not working
        pie.x += 1
        stage.update();
    }
}

【问题讨论】：

标签： javascript easeljs createjs

【解决方案1】：

更改自定义属性（例如setMyAngle）不会自动更新您的形状；你必须重新绘制自己。例如，您可以将绘图代码移动到 handleTick 方法中：

function handleTick() {
    pie.setMyAngle += 0.1;
    pie.x += 1;
    pie.graphics.clear();
    pie.graphics.beginFill("rgba(255,255,255,1)").arc(75, 75, 75, 0, Math.PI * pie.setMyAngle, false).lineTo(75, 75).closePath();
    stage.update();
}

【讨论】：

谢谢，这对我也有帮助。我需要知道如何在 Easeljs 中绘制圆形扇区。供参考：method arc

【解决方案2】：

我写了一个有趣的小动画TweenJS + DrawingAPI 看看：D，可能会帮助别人。

【讨论】：