1. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(1)華為手機無法使用addEventListener click 的兼容解決方案
2. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(2)文本標簽顯示和隱藏的切換開關
3. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(3)自動獲取地圖多邊形中心點坐標
4. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(4)顯示指定區(qū)域在移動端異常的解決方案
5. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(5)區(qū)域限制移動端鬼畜抖動的解決方案
6. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(6)多個標注覆蓋層級導致不能響應點擊的問題
7. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(7)JavaScript開源庫幾何運算判斷點是否在多邊形內(nèi)（電子圍欄）
8. 漏刻有時百度地圖API實戰(zhàn)開發(fā)(8)：圓形區(qū)域周邊搜索地圖監(jiān)聽事件(覆蓋物重疊顯示層級\圖像標注監(jiān)聽事件、setZIndex和setTop方法)
   
   百度地圖JavaScript開源庫，是一套基于百度地圖API二次開發(fā)的開源的代碼庫。目前提供多個lib庫，幫助開發(fā)者快速實現(xiàn)在地圖上添加Marker、自定義信息窗口、標注相關開發(fā)、區(qū)域限制設置、幾何運算、實時交通、檢索與公交駕車查詢、鼠標繪制工具等功能。

判斷點是否在多邊形內(nèi)，主要使用的GeoUtils類。它提供若干幾何算法，用來幫助用戶判斷點與矩形、 圓形、多邊形線、多邊形面的關系,并提供計算折線長度和多邊形的面積的公式。 主入口類是GeoUtils。

引入JS封裝庫

    <script type="text/javascript" src="//api.map.baidu.com/api?v=3.0&ak=3HGqGo***"></script>
    <script type="text/javascript" src="//api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script>

構建HTML地圖容器

<div style="float:left;width:600px;height:500px;padding: 15px;" id="container"></div>

核心代碼

var map = new BMap.Map("container");
    var pt = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(pt, 16);
    map.enableScrollWheelZoom();//開啟滾動縮放

    //電子圍欄
    var pts = [];
    var pt1 = new BMap.Point(116.395, 39.910);
    var pt2 = new BMap.Point(116.394, 39.914);
    var pt3 = new BMap.Point(116.403, 39.920);
    var pt4 = new BMap.Point(116.402, 39.914);


    pts.push(pt1);
    pts.push(pt2);
    pts.push(pt3);
    pts.push(pt4);

    var opts = {
        fillColor: 'blue',
        fillOpacity: 0.3,
        strokeColor: 'blue',
        strokeStyle: "dashed",
        strokeWeight: 1,
        strokeOpacity: 0.5
    }
    var ply = new BMap.Polygon(pts, opts);
    map.addOverlay(ply);

    //地圖監(jiān)聽事件
    map.addEventListener('click', function (e) {
        var x = e.point.lng;
        var y = e.point.lat;
        var newPoint = new BMap.Point(x, y);
        var mkr = new BMap.Marker(newPoint);
        map.addOverlay(mkr);

        //判斷時間
        ptInPolygon(newPoint, ply);
    })

    var allOverlay = map.getOverlays();
    console.log(allOverlay[0]);

    //點在多邊形內(nèi)
    function ptInPolygon(pt, ply) {
        var result = BMapLib.GeoUtils.isPointInPolygon(pt, ply);
        if (result == true) {
            $("#control").append("操作在電子圍欄內(nèi)<br>");
        } else {
            $("#control").append("超出電子圍欄<br>");
        }
    }

封裝函數(shù)及優(yōu)化

@漏刻有時文章來源地址http://www.zghlxwxcb.cn/news/detail-722369.html

到了這里，關于百度地圖API：JavaScript開源庫幾何運算判斷點是否在多邊形內(nèi)（電子圍欄）的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！