javascript - 画像との衝突（不規則な形状）

Question

私は現在ゆるい鳥を作っていて、ただの長方形から自分のイメージなどに変更しました。どうすればいいのかわからないので、鳥（不規則な形）が長方形にぶつかると死んでしまいます。奇妙な形状の衝突をコーディングする方法がわかりません。これが画像です。こんな鳥を描いています。

var img = document.getElementById("bird");
brush.drawImage(img, 20, this.y);

ゲーム、鳥、コードの写真が添付されています。

score 0 · Accepted Answer

コライダーを実装する必要があります。Unity などのゲームエンジンですぐに使用できますが、これを自分で実装したい場合は、次のことを考慮してください。

鳥と壁のコライダーコンポーネントを作成します。コライダーは単純化された形状で、CPU 速度に関して衝突検出アルゴリズムをより簡単かつ高速にします。たとえば、鳥の場合は周囲を円で囲み、壁を長方形にすることができます。
Update frame イベント中に、鳥の境界円が壁の長方形と交差するかどうかを確認します。これは簡単な数学です。Google で「円と四角形の交点」の公式を見つけることができます。
衝突が検出された場合 - あなたの鳥は衝突するはずです)

それでおしまい！

score 0 · Accepted Answer

この件に関する優れた本は次のとおりです。 Thomas Schwarzl による 2D Game Collision Detection: An Introduction to clashing geometry in games

長方形の衝突を処理できる場合は、複雑な図形の形状を長方形で埋めて、それぞれをテストしてみてください。あなたの場合、鳥に円を使用してみてください。

2 に答える 2