Javascript 用TweenMax缩放小精灵

我试图了解如何将PixiJS与GSAP库Twemax一起使用。 为此，我使用两个库在项目中查找一些代码，如下所示：

但是，我很难理解为什么我不能扩展。 当我尝试缩放时，我的球会转到窗口的左上角[0，0]。 当我指定scaleX和scaleY时，什么都没有。 在这两种情况下，我的动画将毫无错误地继续

这是我的密码

var renderer,
    stage;

var init = function() {

    // We create the canvas element
    stage = new PIXI.Stage(0x202020);
    renderer = new PIXI.CanvasRenderer(800, 600, null, false, true);
    document.getElementById("loader").appendChild(renderer.view);

    $(window).resize(onResize);
    onResize();

    requestAnimFrame(animate);

    drawElements();

};

var onResize = function() {
    renderer.resize(window.innerWidth, window.innerHeight);
}

var drawElements = function() {

    var ball = new PIXI.Sprite.fromImage("./img/ball.png");

    ball.position.x = (window.innerWidth / 2) - 5;
    ball.position.y = -10;

    ball.scaleX = ball.scaleY = 1;
    stage.addChild(ball);

    var t1 = new TimelineMax({onUpdate:animate, onUpdateScope:stage});
    t1.to(ball, 1.5, {y: (window.innerHeight / 2), ease:  Bounce.easeOut})
    .to(ball, 2, {scaleX: 10})
    .to(ball, 2, {alpha: 0});

}

var animate = function() {
    requestAnimFrame(animate);
    renderer.render(stage);
}

window.onload = function() {
    init();
}

---

为你们的帮助干杯

PIXI精灵的缩放属性是一个具有x和y属性的点，因此不是：

ball.scaleX = ball.scaleY = 1;

您需要执行以下操作：

ball.scale.x = ball.scale.y = 1;

在缩放之间传递时，需要传递缩放对象，而不是精灵本身，如下所示：

tween.to(ball.scale, 2, {x: 10});