如何用代码判断两个矩形是否相交,矩形有角度,不能用碰撞器

以下是两个矩形的例子,要判断这两个矩形碰撞,因为要做联机对战游戏,逻辑可能需要写在服务端,或者帧同步自己算碰撞,所以不能用引擎自带的碰撞器检测,只能代码实现,如果矩形没角度还好算,有角度就难搞了。

1赞

OBB碰撞

这不就是基本的obb吗

var CollisionDetector = {

    detectorOBBvsOBB: function (OBB1, OBB2) {
        var nv = OBB1.centerPoint.sub(OBB2.centerPoint);
        var axisA1 = OBB1.axes[0];
        if (OBB1.getProjectionRadius(axisA1) + OBB2.getProjectionRadius(axisA1) <= Math.abs(nv.dot(axisA1))) return false;
        var axisA2 = OBB1.axes[1];
        if (OBB1.getProjectionRadius(axisA2) + OBB2.getProjectionRadius(axisA2) <= Math.abs(nv.dot(axisA2))) return false;
        var axisB1 = OBB2.axes[0];
        if (OBB1.getProjectionRadius(axisB1) + OBB2.getProjectionRadius(axisB1) <= Math.abs(nv.dot(axisB1))) return false;
        var axisB2 = OBB2.axes[1];
        if (OBB1.getProjectionRadius(axisB2) + OBB2.getProjectionRadius(axisB2) <= Math.abs(nv.dot(axisB2))) return false;
        return true;

    }
}

Vector2 = function (x, y) {
    this.x = x || 0;
    this.y = y || 0;
};

Vector2.prototype = {
    sub: function (v) {
        return new Vector2(this.x - v.x, this.y - v.y)
    },
    dot: function (v) {
        return this.x * v.x + this.y * v.y;
    }
};

var OBB = function (centerPoint, width, height, rotation) {

    this.centerPoint = centerPoint;
    this.extents = [width / 2, height / 2];
    this.axes = [new Vector2(Math.cos(rotation), Math.sin(rotation)), new Vector2(-1 * Math.sin(rotation), Math.cos(rotation))];

    this._width = width;
    this._height = height;
    this._rotation = rotation;
}

OBB.prototype = {
    getProjectionRadius: function (axis) {
        return this.extents[0] * Math.abs(axis.dot(this.axes[0])) + this.extents[1] * Math.abs(axis.dot(this.axes[1]));
    }
}

var OBB1, OBB1x = 320, OBB1y = 480, OBB1w = 40, OBB1h = 55, OBB1r = 0;
var OBB2, OBB2x = 342, OBB2y = 530, OBB2w = 26, OBB2h = 243, OBB2r = 276;

for (var i = 0; i < 100; i++) {

    OBB1r += 2;
    OBB2r += 1;

    OBB1 = new OBB(new Vector2(OBB1x, OBB1y), OBB1w, OBB1h, OBB1r * Math.PI / 180);
    OBB2 = new OBB(new Vector2(OBB2x, OBB2y), OBB2w, OBB2h, OBB2r * Math.PI / 180);
    var r = CollisionDetector.detectorOBBvsOBB(OBB1, OBB2);

    console.log("collision i=", i, r);
}

复制上面代码
保存为obbtest.js
然后命令行执行 node obbtest.js

或者下载附件,附件是网页版测试用例,用浏览器打开test.html

旋转矩形碰撞测试.zip (136.5 KB)

6赞

mark!!!