在不使用循环的情况下检测二维网格上的鼠标碰撞
Detect mouse collision on a 2d grid without using loops
我正在构建一个迷宫求解器,最近我希望能够在网格上绘制而无需使用数组手动构建迷宫。无论如何,我坐下来想“必须有一种更有效的方法来确定鼠标在单击事件时与哪个单元格发生碰撞,而不是必须遍历整个网格,这在最坏的情况下会花费成本O(n^2)
."
经过一番思考,我想出了以下解决方案。
我知道每个网格的大小是恒定的(在我的例子中 16x16
)并且我知道鼠标的位置。所以我决定将鼠标位置除以 tileSize
然后四舍五入。
我的问题是,这是否是比逐个单元格遍历整个网格更好的解决方案。我还没有看到有人这样做,所以我想知道是否有一些我没有想到的边缘情况可能不适用于此解决方案。
你所做的是标准的做法。老实说,我从来没有想过通过任何形式的循环来做到这一点。
因为这是标记的 javascript I'm gonna go ahead and recommend this answer of mine in case you have any problems getting the right coordinates for a canvas that was stretched or has borders:
链接的答案使用您问题中的公式确定鼠标悬停的像素,tileSize
为一。对于给定 tileSize
,则拼贴为 [floor(x/tileSize), floor(y/tileSize)]
。
我正在构建一个迷宫求解器,最近我希望能够在网格上绘制而无需使用数组手动构建迷宫。无论如何,我坐下来想“必须有一种更有效的方法来确定鼠标在单击事件时与哪个单元格发生碰撞,而不是必须遍历整个网格,这在最坏的情况下会花费成本O(n^2)
."
经过一番思考,我想出了以下解决方案。
我知道每个网格的大小是恒定的(在我的例子中 16x16
)并且我知道鼠标的位置。所以我决定将鼠标位置除以 tileSize
然后四舍五入。
我的问题是,这是否是比逐个单元格遍历整个网格更好的解决方案。我还没有看到有人这样做,所以我想知道是否有一些我没有想到的边缘情况可能不适用于此解决方案。
你所做的是标准的做法。老实说,我从来没有想过通过任何形式的循环来做到这一点。
因为这是标记的 javascript I'm gonna go ahead and recommend this answer of mine in case you have any problems getting the right coordinates for a canvas that was stretched or has borders:
链接的答案使用您问题中的公式确定鼠标悬停的像素,tileSize
为一。对于给定 tileSize
,则拼贴为 [floor(x/tileSize), floor(y/tileSize)]
。