javascript - 如何检测多边形上的碰撞

Question

我正在尝试使用CraftyJS检测我的播放器（只是一个正方形）和一个多边形之间的碰撞：

// Init Crafty:
Crafty.init();
Crafty.canvas.init();

var AttackPoly = new Crafty.polygon([
    [-8, 6],
    [0, -8],
    [8, -14],
    [16, -8],
    [24, 6]
]);

attackEnt = Crafty.e("AttackRange, 2D, Canvas, Collision, SolidHitBox, Color").attr({x:50, y:50}).collision(AttackPoly);

Crafty.e("2D, Canvas, Color, Fourway, Collision, Tester").attr({
    x: 100,
    y: 60,
    w: 4,
    h: 4
}).color("orange");

Crafty.e("2D, Canvas, Color, Fourway, Collision, Tester").attr({
    x: 100,
    y: 50,
    w: 4,
    h: 4
}).color("orange");

Crafty.e("2D, Canvas, Color, Fourway, Collision, Tester").attr({
    x: 100,
    y: 40,
    w: 4,
    h: 4
}).color("orange");

Crafty("Tester").bind("EnterFrame", function () {
    this.x -= .2
    if (this.hit("AttackRange")) this.color("aqua")

});

撞到多边形的方块不会改变它们的颜色。我错过了什么？

小提琴：http: //jsfiddle.net/c3597/32/

Answer 1

我想通了：多边形必须在边界矩形内：

Crafty
  .e('AttackRange, 2D, Canvas, Collision, SolidHitBox, Color')
  .attr({x:50, y:50, w: 100, h: 100})
  .collision(new Crafty.polygon([
    [0, 0],
    [100, 50],
    [0, 100]
  ]))
  .color('blue'); 

小提琴：http: //jsfiddle.net/c3597/33/