2011-01-31 13 views
1

私は非常に一貫して生成されているポンボールを持っていますが、 レートは動的に変化します。だから、第二与えられた中で、1個のピンポン 画面全体に引かれ、翻訳されていますボール(常に 左から右に)、または50RaphaelJS - 同時アニメーション

があるかもしれない私は、これらの世代に基づいて応答ピンポンパドルを持っています ボールで、のボールがボールのすべてを「捕まえる」と考えられています。 pongパドルは決して動かないので、x座標は常に ですが、y座標はランダムに生成された です。ここで

は私が がやっているのは極めて類似した(同一でない)例を示しますhttp://www.youtube.com/watch?v=HeWfkPeDQbY

を私はこのコードの多くは、すでに書かれてありますが、私はボールをキャッチするための私の設計 が怖いです不正確/非効率。それは動作しますが、 パドルは、それに向かって投げられた であるボールと非常に簡単に同期しなくなります。

私は現在、これをやっている方法は、 グローバル配列に各ボールオブジェクトを置くことであり、そしてパドルはこのキューのオフ次のボールをポップし、 は にそれが必要とする速度を計算するための基本的な算術演算を使用しています次のボールのy座標に変換します。

これを行うより効率的な方法はありますか?

+0

実際のコードを見る必要があります。 http://jsfiddle.netはどうですか? –

答えて

2

私は、ボール(とパドル)の動きが別のタイマーで制御されていると仮定します。 jsタイマーの正確性については保証されていないので、実際にはは、多くのタイマーがやりとりすることを保証していません。

問題を修正するために、2つの広範なアプローチがある:代わりにraphaeljsアニメーションプリミティブを使用しての

  1. 、SETTIMERと同期したアニメーションを自分で実装し、同期して各ボールの位置(パドル)を更新します。そして、あなたの宇宙のすべての要素に一貫して適用されます。

  2. フィードバックを使用して、パドルの位置をコース補正します。パドルがどこにあるかを定期的に見て、パドルのアニメーションで.stop()を必要に応じて呼び出して、より積極的なパラメータで再実行し、ギャップを閉じる特別なsetTimerを持つことによって、

+0

これは良いアイデアです。ただし、特にRaphaelの使用に縛られていない場合は、これが 'canvas'でうまくいくかもしれない例です。 – chris5marsh

関連する問題