GSAP：如何同時補間嵌套屬性

我有一個Camera類，它有兩個我想同時動畫的屬性。我想動畫它的distance屬性（它是一個數字）和rotation屬性（它具有x, y, z元素）。我已經嘗試以下操作：GSAP：如何同時補間嵌套屬性

嘗試1：

TweenLite.to(this.camera, 1.0, {distance: 30, rotation.y: 10, rotation.x: 50});

嘗試2：

TweenLite.to(this.camera, 1.0, {distance: 30, rotation:{y: 10, x: 50}});

嘗試1失敗，因爲它不允許vars內點符號參數。嘗試2失敗，我無法獲得任何動畫（在TweenLite v：1.20.2中）。有沒有我可以用來同時觸發距離和旋轉動畫的語法？已經工作變得非常快，一旦我有長篇大論以上幾個屬性的唯一方法動畫：

TweenLite.to(this.cam, 1.0, {distance: 30}); 
TweenLite.to(this.cam.rotation, 1.0, {y:10, x: 50}); 
TweenLite.to(this.cam.position, 1.0, {x:0.5, z: 3});

來源

2017-08-15 Marquizzo

我認爲你需要使用AttrPlugin

TweenLite.to(this.camera, 1, {attr:{distance: 30, rotation:{y: 10, x: 50}}});

來源

2017-08-16 16:18:53

我只是給它一個鏡頭，但它不工作。它看起來像AttrPlugin只是修改HTML DOM元素中的屬性，比如'

哦，我明白了。對不起，我沒有看到codepen/jsfiddle就沒有明白。它看起來好像你可能必須在兩行中完成 - 一個是爲this.cam創建動畫，另一個是爲this.cam.rotation創建動畫（按照你的詳細示例）。在這裏看到GSAP論壇相關的問題：https://greensock.com/forums/topic/7888-tween-the-properties-of-an-object-of-an-object-in-an-array/ –

GSAP：如何同時補間嵌套屬性

回答

相關問題