Question

需要一些帮助来检测一个动态旋转的2个元素的碰撞/重叠。

我正在制作一个游戏，用户根据鼠标光标位置控制旋转和移动的剑，用于此的图像宽5像素，长130英尺。可以在整个360度旋转。我将在页面上产生目标，用户需要用他的剑进行斜线扫描，因此我需要检测图像何时切入目标div之一。由于图像的旋转，我似乎无法进行工作检测。

有没有人可以指出我正确的方向/有这样的检测解决方案？

我到目前为止的例子，没有正确的检测

http://tinyurl.com/ovfhfwx

我开始使用类似下面的内容

var square = {x: 500, y: 500, width: 25, height: 25}
var intervalId = setInterval(function(){
    var lightsaber = {
        x: getOffset( document.getElementById('lightsaber') ).left,
        y: getOffset( document.getElementById('lightsaber') ).top,
        width: $("#lightsaber").width(),
        height: $("#lightsaber").height()
     }

    if (lightsaber.x < square.x + square.width &&
       lightsaber.x + lightsaber.width > square.x &&
       lightsaber.y < square.y + square.height &&
       lightsaber.height + lightsaber.y > square.y) {
        console.log('collision');
       //clearInterval(intervalId);
    }
 }, 33);

这显然没有旋转碰撞盒，就像它总是直立一样，我希望有一些类似的解决方案，但它会旋转碰撞盒。

谢谢！

旋转元件碰撞/重叠检测

0 个答案: