文章/答案/技术大牛

发布

社区首页 >问答首页 >TweenJS绝对位置(to()方法)不工作

问TweenJS绝对位置(to()方法)不工作
EN

Stack Overflow用户

提问于 2015-07-21 14:27:06

回答 1查看 334关注 0票数 1

我被告知，在两个对象中的.to()方法将图形对象移动到画布上的一个精确点。但是，当我运行下面的代码时，.to()方法将增加400个像素到圆圈的原始x位置，即165。所以，这个圆圈是565，但我希望它在画布上达到400个像素。有人知道为什么会发生这种情况吗?我能做些什么让它在画布上达到400像素呢？

<html>
    <title>Pool Game</title>
    <head>
    <script src="https://code.createjs.com/easeljs-0.8.0.min.js"></script>
    <script src="https://code.createjs.com/tweenjs-0.6.1.min.js"></script>

    <script>

    function init(){
        stage = new createjs.Stage("myCanvas");
        var circle = new createjs.Shape();
        circle.graphics.beginFill("blue");
        circle.graphics.drawCircle(165, 250, 25);
        stage.addChild(circle);
        stage.update();
        createjs.Tween.get(circle, {loop: false})
                .to({ x: 400}, 1000);
        createjs.Ticker.setFPS(60);
        createjs.Ticker.addEventListener("tick", stage);
    }

    </script>

    </head>
    <body onload="init();">
        <canvas id="myCanvas" width="1000" height="500"></canvas>
    </body>

</html>

javascript

html

css

easeljs

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-07-21 18:52:42

这是因为您通过drawCircle调用的第一个参数将圆的中心点设置为165。查看这里的文档：drawCircle

你应该做这样的事

circle.graphics.drawCircle(0, 0, 25);
circle.x = 165;
circle.y = 250;

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/31541888

复制

相似问题

问TweenJS绝对位置(to()方法)不工作
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TweenJS绝对位置(to()方法)不工作EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TweenJS绝对位置(to()方法)不工作
EN