找到矩形位置,使其覆盖2D空间中的最大点

Question

找到矩形位置,使其覆盖2D空间中的最大点

Har*_*can 7 algorithm graphics geometry intersection graphics2d

给定具有X点的2D空间,如何有效地找到放置固定大小矩形的位置,以便它覆盖那些X点的最大可能数量？

我需要沿着这些线条在我正在构建的2D游戏中定位视口.

Answer 1

m69*_*g'' 5

从左到右对点进行排序.left在最左边的点设置一个指针,在最right右边的点设置一个指针left + width.然后迭代所有点,right每次重新计算指针的位置,直到它在最后一点.
从上到下对左右之间的每个点子集进行排序.top在最高点设置bottom指针,在最低点设置指针top + height.然后迭代所有点,bottom每次重新计算指针的位置,直到它在最后一点.
对于左,右,上和下之间的每个点子集,检查它有多少个点,并存储最佳子集.
一旦找到最佳子集,矩形的中心位于最左侧和最右侧点之间,并且位于最高点和最低点之间.

下面是Javascript中的一个简单实现,可以在很多方面进行优化.运行代码段以查看随机数据的结果.

function placeRectangle(p, width, height) {
    var optimal, max = 0;
    var points = p.slice();
    points.sort(horizontal);

    for (var left = 0, right = 0; left < points.length; left++) {
        while (right < points.length && points[right].x <= points[left].x + width) ++right;
        var column = points.slice(left, right);
        column.sort(vertical);

        for (var top = 0, bottom = 0; top < column.length; top++) {
            while (bottom < column.length && column[bottom].y <= column[top].y + height) ++bottom;
            if (bottom - top > max) {
                max = bottom - top;
                optimal = column.slice(top, bottom);
            }
            if (bottom == column.length) break;
        }
        if (right == points.length) break;
    }

    var left = undefined, right = undefined, top = optimal[0].y, bottom = optimal[optimal.length - 1].y;
    for (var i = 0; i < optimal.length; i++) {
        var x = optimal[i].x;
        if (left == undefined || x < left) left = x;
        if (right == undefined || x > right) right = x;
    }
    return {x: (left + right) / 2, y: (top + bottom) / 2};

    function horizontal(a, b) {
        return a.x - b.x;
    }

    function vertical(a, b) {
        return a.y - b.y;
    }
}

var width = 160, height = 90, points = [];
for (var i = 0; i < 10; i++) points[i] = {x: Math.round(Math.random() * 300), y: Math.round(Math.random() * 200)};
var rectangle = placeRectangle(points, width, height);

// SHOW RESULT IN CANVAS
var canvas = document.getElementById("canvas");
canvas.width = 300; canvas.height = 200;
canvas = canvas.getContext("2d");
paintRectangle(canvas, rectangle.x - width / 2, rectangle.y - height / 2, width, height, 1, "red");
for (var i in points) paintDot(canvas, points[i].x, points[i].y, 2, "blue");
function paintDot(canvas, x, y, size, color) {
    canvas.beginPath();
    canvas.arc(x, y, size, 0, 6.2831853);
    canvas.closePath();
    canvas.fillStyle = color;
    canvas.fill();
}
function paintRectangle(canvas, x, y, width, height, line, color) {
    canvas.beginPath();
    canvas.rect(x, y, width, height);
    canvas.closePath();
    canvas.lineWidth = line;
    canvas.strokeStyle = color;
    canvas.stroke();
}

Run Code Online (Sandbox Code Playgroud)

<BODY STYLE="margin: 0; border: 0; padding: 0;">
<CANVAS ID="canvas" STYLE="width: 300px; height: 200px; float: left; background-color: #F8F8F8;"></CANVAS>
</BODY>

Run Code Online (Sandbox Code Playgroud)

归档时间：	10 年前
查看次数：	1572 次
最近记录：	6 年，5 月前