判斷點擊區域算法

上篇文章解決了四邊形帶旋轉角度問題,耗費一天時間想到的解決算法。可是僅僅侷限於四邊形。
原來大神早就寫好了算法,能夠解決n多邊形點擊區域判斷。
預用此算法,首先要保證多邊形第一個點的x軸爲最小值,也就是說先要給多邊形各個點座標作一個排序,找到x最小的點,放到第一個,其餘點依次旋轉。算法

旋轉方法:ide

function sort(ele) {
    var min = 0,
        arr = [],
        len = ele.length;
    for(var n = 0; n < len; n++){
        if(ele[n][0] < ele[min][0]){
            min = n
        }
    }
    if(min != 0){
        for(var x = min; x < ele.length; x++){
            arr.push(ele[x]);
        }
        for(var y = 0; y < min; y++){
            arr.push(ele[y]);
        }
        return arr
    }
    return ele;
}
var bbox = [[4],[1],[2],[3]];
sort(bbox)//[[1],[2],[3],[4]]

判斷點擊區域是否在多邊形範圍內:code

navi_utils.pointInPolygon = function (pos, polygon) {
    var inside = false;
    var polygonSize = polygon.length;
    var val1, val2;
    for(var i = 0; i < polygonSize; i++){
        var p1 = polygon[(i +  polygonSize)%polygonSize];
        var p2 = polygon[(i + 1 + polygonSize)%polygonSize];
        if(pos[1] < p2[1]){
            if(pos[1] >= p1[1]){
                val1 = (pos[1] - p1[1]) * (p2[0] - p1[0]);
                val2 = (pos[0] - p1[0]) * (p2[1] - p1[1]);
                if(val1 > val2){
                    inside = ! inside;
                }
            }
        }else if( pos[1] < p1[1]){
            val1 = (pos[1] - p1[1]) * (p2[0] - p1[0]);
            val2 = (pos[0] - p1[0]) * (p2[1] - p1[1]);
            if(val1 < val2){
                inside = ! inside;
            }
        }
    }
    return inside;
};
相關文章
相關標籤/搜索