JS实现判断点是否在多边形范围内

一、说明

在GIS领域，判断点是否在多边形范围内是一个基础方法，这里主要说下实现原理。

原理比较简单，就是有一个GIS理论，一个点向一个方向发送射线，射线与多边形各个边相交的交点如果是奇数说明点在多边形范围内。

 

(图片引用自：https://blog.csdn.net/qq_27161673/article/details/52973866)

 

二、实现代码

所以实现代码就很清晰了，随便一个点向右侧创建射线，为啥是右侧呢，因为横线可以保持y不变，这种情况最简单更好理解。实现代码如下：

        //判断点是否在多边形范围内        function queryPtInPolygon(point, polygon) {            var p1, p2, p3, p4;            p1 = point;            p2 = { x: 1000000000000, y: point.y };            var count = 0;            //对每条边都和射线作对比            for (var i = 0; i < polygon.length - 1; i++) {                p3 = polygon[i];                p4 = polygon[i + 1];                if (checkCross(p1, p2, p3, p4) == true) {                    count++;                }            }            p3 = polygon[polygon.length - 1];            p4 = polygon[0];            if (checkCross(p1, p2, p3, p4) == true) {                count++;            }            return (count % 2 == 0) ? false : true;            //判断两条线段是否相交            function checkCross(p1, p2, p3, p4) {                var v1 = { x: p1.x - p3.x, y: p1.y - p3.y },                v2 = { x: p2.x - p3.x, y: p2.y - p3.y },                v3 = { x: p4.x - p3.x, y: p4.y - p3.y },                v = crossMul(v1, v3) * crossMul(v2, v3);                v1 = { x: p3.x - p1.x, y: p3.y - p1.y };                v2 = { x: p4.x - p1.x, y: p4.y - p1.y };                v3 = { x: p2.x - p1.x, y: p2.y - p1.y };                return (v <= 0 && crossMul(v1, v3) * crossMul(v2, v3) <= 0) ? true : false;            }            //计算向量叉乘            function crossMul(v1, v2) {                return v1.x * v2.y - v1.y * v2.x;            }        }    }

使用示例

var point={x:10,y:10};var polygon=[{x:0,y:0},{x:100,y:0},{x:100,y:100},{x:0,y:100},{x:0,y:0}];	var pts=queryPtInPolygon(points,polygon); //pts即为和多边形交叉的点集合，判断为奇数说明在多边形范围内

　　

测试用例下载地址：https://download.csdn.net/download/jiangfei200809/9213835