ステージ内のMovieClipをターゲットにするために関数内でGSAPを使用できません（アニメーションCC）

Question

私はHTML5初心者です。私がここで間違っていることを誰かが教えてくれるのだろうかと思っていました。 GSAPを使用して、ステージに追加するベクトルファイルをアニメーション化し、関数を呼び出すときにアニメーション化できるようにする必要がありますが、これをやろうとすると、私は得ることができます。トゥイーンできませんヌルオブジェクトですが、関数にラップされていない場合はアニメーションが正常に動作します。

私は問題が持続し、それがなかったかどうかを確認するために、新しいHTML5のキャンバスを作成したので、これは私がやったことです：

は
1. は、空白のHTML5のキャンバスにシンボルを追加しましたそのムービークリップ行われ、描きましたサークル。

   function playAnimation() { 
       TweenMax.to(this.mcThing, 3, {y:500}); 
   } 
   playAnimation(); 
   

2. Chromeでテストする場合、私はがnullオブジェクトをトゥイーンすることはできません取得する：私はタイムラインでmcThing
3. インスタンスと呼ばれる、私は私が書いた最初のフレームを選択し、

4. アクション

に入りました。私は this.を省略（ mcThingとしてそれを参照する場合は、私が代わりに mcThingがに定義されていない取得

5. を、私は、関数を削除し、ちょうど持っている場合は、この：。

   TweenMax.to(this.mcThing, 3, {y:500}); 
   

   それは罰金果たしているが、今私がすることができます私がする必要があるとき「tはそれを呼び出す

をいくつかのコンテキスト：。

を基本的に現在どのようなI haveはWebSocketでメッセージをリッスンしています。メッセージを受信すると、キューに追加されます。私はアニメーションを再生し、そのメッセージからテキストを挿入するようにしています。テキスト自体は大丈夫です：CreateJSを使ってコード内のテキストをインスタンス化し、TweenMaxがそこで動作しますが、問題はシェイプ/図面をアニメーション化することです。私はコード自体のすべての図形をインスタンス化することができ、TweenMaxはそれで動作すると思いますが、アニメーション/図形がかなり複雑なので現実的ではないと私は考えています。アニメーションが再生され、停止すると、メッセージがキューから削除され、次のメッセージが再生されます（同じアニメーション、別のテキスト）。

これは範囲の問題だと思いますが、私は何を変更する必要があるのか​​よくわかりません。どんな助けでも大歓迎です！

Answer 1

この問題は、範囲のためです。 playAnimationはthisにスコープされていないため、グローバルスコープで呼び出されます。

はこれを試してみてください：

関数スコープにあなたの mcThingを置く

this.playAnimation = function() { 
    TweenMax.to(this.mcThing, 3, {y:500}); 
} 
this.playAnimation(); 

でも動作します：

var thing = this.mcThing; 
function playAnimation() { 
    TweenMax.to(thing, 3, {y:500}); 
} 
playAnimation(); 

それとも、機能自体をスコープ呼び出すことができます！

スコープの仕組みを理解すれば、それを回避する方法はたくさんあります。私は最初のアプローチをお勧めします。

希望に役立ちます！