Javascript检查鼠标在圆形或多边形内单击

Question

任何人都知道如何检查在圆形或多边形内单击鼠标的方法.我的问题是我想检查一下,如果鼠标已经在圆圈或多边形内部被克隆了.圆或多边形坐标已存储在数组中.任何帮助都非常感谢

Answer 1

正如其他一些答案所示,我按照一些链接在这里找到了c代码.以下是用于查找点是否在多边形中的JavaScript转换

版权所有(c)1970-2003,Wm.伦道夫富兰克林

特此授予任何获得本软件和相关文档文件("软件")副本的人免费许可,以无限制地交易本软件,包括但不限于使用,复制,修改,合并的权利根据以下条件,出版,分发,再许可和/或出售本软件的副本,并允许向其提供本软件的人员这样做:

1. 源代码的重新分发必须保留上述版权声明,此条件列表和以下免责声明.
2. 二进制形式的再分发必须在随分发提供的文档和/或其他材料中复制上述版权声明.
3. 未经事先书面许可,不得使用W. Randolph Franklin的名称来认可或宣传本软件衍生的产品.

本软件按"原样"提供,不提供任何明示或暗示的保证,包括但不限于适销性,特定用途的适用性和不侵权的保证.在任何情况下,作者或版权所有者均不对任何索赔,损害或其他责任承担任何责任,无论是在合同,侵权行为还是其他方面,由本软件引起或与之相关,或者与本软件的使用或其他交易有关.软件.

function pnpoly( nvert, vertx, verty, testx, testy ) {
    var i, j, c = false;
    for( i = 0, j = nvert-1; i < nvert; j = i++ ) {
        if( ( ( verty[i] > testy ) != ( verty[j] > testy ) ) &&
            ( testx < ( vertx[j] - vertx[i] ) * ( testy - verty[i] ) / ( verty[j] - verty[i] ) + vertx[i] ) ) {
                c = !c;
        }
    }
    return c;
}

nvert - 多边形中的顶点数.下面讨论是否在末尾重复第一个顶点.
vertx,verty - 包含多边形顶点的x坐标和y坐标的数组.
testx,testy - 测试点的X坐标和y坐标.

Answer 2

对于圆形情况,它非常简单,只需检查从点到中心的距离是否小于(oet)半径:

function intersects(x, y, cx, cy, r) {
    var dx = x-cx
    var dy = y-cy
    return dx*dx+dy*dy <= r*r
}

对于多边形,最简单的方法是想象一条直线从该点直线向上.如果此线穿过奇数个多边形边框,则您的点位于多边形内.(它只会跨越一个多边形边框以获得简单的凸多边形)

您也可以找到第三方几何库,但它可能比您自己编写代码花费更多时间.

Answer 3

圆很简单，只需使用毕达哥拉斯定理检查从该点到圆心的距离是否小于圆的半径（另请参阅此问题）。

多边形更具挑战性。该文章链接到 C 代码来完成此操作，该代码应该可以翻译为 JavaScript。