百度地圖javascript開發,刪除指定覆蓋物方法

jiyulin發表於2018-06-27

        在百度地圖開發的過程中,經常有人問到如何刪除指定覆蓋物。本站openGPS.cn決定做一個分享,將自己在處理這個問題i時候寫過的一個方法分享出來。


        百度地圖提供了清除所有覆蓋物的方法,也提供了刪除指定覆蓋物的方法。刪除所有覆蓋物不用多說,隨時用隨時刪除,程式碼就一句:map.clearOverlays();


        然而刪除指定覆蓋物,這個需求很多新人不容易實現。

        原因:宣告過的變數,沒有獨立儲存下來,就不知道怎麼找到這個變數,然後把這個變數作為引數傳進去執行刪除。


        本文先提供一個刪除指定型別覆蓋物的方法:

    

        // openGPS.cn提示: 刪除所有折線覆蓋物
        function clearAllPolyline() {
            var allOverlay = map.getOverlays();
            for (var i = 0; i < allOverlay.length; i++) {
                if (allOverlay[i].toString() == "[object Polyline]") {
                    map.removeOverlay(allOverlay[i]);
                }
            }
        }
        // openGPS.cn提示: 刪除所有lable覆蓋物
        function clearAllLable() {
            var allOverlay = map.getOverlays();
                for (var i = 0; i < allOverlay.length; i++) {
                    if (allOverlay[i].toString() == "[object Marker]") {
                        map.removeOverlay(allOverlay[i].getLabel()); //注意獲取lable的方式
                    }
                }
        }
    


        然後,在講講如何刪除特定覆蓋物,這裡有個前提:在建立某個需要被操作的覆蓋物之前,需要為其賦值一個id。我的示例中,所有的Marker屬性都是用  marker.imei = "xxxxxx";  的方式為Marker物件賦值了一個id(tip:請記住js語法特點,直接屬性賦值就可以用),遍歷的時候配合對該id的檢查實現刪除該覆蓋物。

    

        /* openGPS.cn提示: 
        我的示例中,所有的Marker屬性都是用  marker.imei = "xxxxxx"; 的方式為Marker物件賦值了一個id
        因此,我的寫法是:
        先獲取全部覆蓋物:
        然後判斷覆蓋物是否是Marker型別:
        然後判斷是否是我要刪除的id(imei):
        然後拿到目標物件,執行刪除操作
        */
        function getMapMarker(imei) {
            var reMarker = null;
            var allOverlay = map.getOverlays();
            for (var i = 0; i < allOverlay.length; i++) {
                if (allOverlay[i].toString() == "[object Marker]") {
                    if (allOverlay[i].getTitle() == imei) {
                        reMarker = allOverlay[i];
                        break;
                    }
                }
            }
            return reMarker;
        }
    


    百度地圖開發,刪除指定覆蓋物的教程暫時寫到這裡。     


原文地址:  文章的更新編輯依此連結為準。歡迎關注源站原創文章! 

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/27102070/viewspace-2156718/,如需轉載,請註明出處,否則將追究法律責任。

相關文章