Akashic Engine 逆引きリファレンス

複雑な条件の当たり判定を調べる

複雑な条件の当たり判定を調べるには collision-js を利用します。

凡例

var co = require("@akashic-extension/collision-js");

// 矩形を定義する
var box1 = {
  position: { x: 300, y: 200 }, // 矩形の中心座標
  halfExtend: { x: 128, y: 96 }, // 矩形の縦・横の半分の長さ
  angle: 0 // 矩形の回転角度[radian]
};

var box2 = {
  position: { x: 100, y: 100 },
  halfExtend: { x: 64, y: 48 },
  angle: 0
};

var isCollision = co.boxToBox(box1, box2); // box1 と box2 が衝突している場合は真を返す

利用例

次のコンテンツは、青の矩形をドラッグ/スワイプし緑の矩形と衝突すると青の矩形の色が赤に変わります。

詳細

collision-js を使うことで様々な形状の当たり判定を取得することができます。エンティティのような矩形の他に、AABB、円、直線、線分、点、ポリゴンなどの形状も判定に利用できます。また、利用できる形状の組み合わせに対して衝突判定関数を提供します。例えば線分と矩形の衝突判定を得たいのであれば、 segmentToBox() を利用することができます。

より簡単に衝突判定を行う方法として、Akashic Engine 標準のg.Collisionを利用することもできます。

collision-js は Akashic Engine での利用を念頭に開発されていますが、単体での利用も可能です。

var co = require("@akashic-extension/collision-js");

// 矩形を定義する
var box = {
  position: { x: g.game.width / 2, y: g.game.height / 2 },
  halfExtend: { x: 128, y: 96 },
  angle: Math.PI / 3
};

// 線分を定義する
var segment = {
  position: { x: 8, y: 128 },
  endPosition: { x: 128, y: 8 }
};

var isCollision = co.segmentToBox(segment, box);

それぞれの衝突判定関数と形状の利用方法は、 collision-js のサンプル を参照してください。

関連情報