百度地圖 保留marker的基礎上，鼠標滑過顯示label，鼠標移開label消失

參考：https://www.cnblogs.com/zongsir/p/8184537.html

這個問題搞了2小時，網上方法很多但是都不太好用。

終於找到個能用的。

目標功能： 實現地圖上顯示若干座標點，鼠標滑過顯示站點名稱label標籤；移開label標籤消失；點擊彈出窗口詳情。

第一：移除label的時候marker還要保留

第二：點擊marker要彈出詳情框

        
法一：（採用，親測有效） 

這部分是鼠標滑過時顯隱藏label標籤的部分代碼，但是label 找不到remove或者hide的方法，所以用隱藏的辦法。下邊是解決辦法：

1，創建的時候 將label設置爲隱藏

2，通過百度地圖監聽事件 ，mouseover或onmouseover 觸發顯示

3，通過mouseover 或onmouseover 觸發隱藏 

var label = new BMapGL.Label(stationName, { offset: new BMapGL.Size(10, -25) });
                        label.setStyle({
                            display:"none",
                            color: "red",
                            fontSize: "12px",
                            height: "20px",
                            lineHeight: "20px",
                            fontFamily: "微軟雅黑"
                        });

                        marker.setLabel(label);

                        marker.addEventListener("mouseover", function(e) {
                            var label = this.getLabel()
                            label.setStyle({ display: "block" });

                        });
                        marker.addEventListener("mouseout", function(e) {
                            var label = this.getLabel()
                            label.setStyle({ display: "none" });
                        });

                        map.addOverlay(marker); //將標記添加到地圖中 

 

方法二：

清除全部除marker以外的覆蓋物，將marker設置爲禁止刪除，再執行清除覆蓋物方法（但是這種方法也對彈出詳情框有影響，所以我採用了第一種方法）

//先將marker設置爲禁止刪除，再清除所有覆蓋物

marker.disableMassClear();//禁止被刪除

map.clearOverlays() //清除所有覆蓋物

 

清除覆蓋物有兩個方法：

map.removeOverlay()  或者 map.clearOverlays()

map.clearOverlays()  方法  ：一次移除所有的覆蓋物

map.removeOverlay() 方法  ： 一次移除一個指定覆蓋物。

例：

//清除指定覆蓋物
var allOverlay = map.getOverlays();
        for (var i = 0; i < allOverlay.length -1; i++){
            if(allOverlay[i].getLabel().content == "aa"){
                map.removeOverlay(allOverlay[i]);
                return false;
            }
}

 

 保留某種覆蓋物

第一步：在添加覆蓋的時候對不需要進行移除操作的覆蓋設置disableMassClear();官網文檔解釋如下

我這裏不需要對marker進行移除操作，所以設置如下：

marker.disableMassClear();

第二步：清除所要清除的覆蓋物，這裏需要清除所有的Polyline而不清除marker，現在可以直接使用

map.clearOverlays();

這樣就能很方便的清除所有Polyline而保留marker；

第三步：當後來需要對marker進行移除操作時，可以使用enableMassClear()方法來取消禁止清除；

但是需要對每個marker進行恢復操作，所以需要進行遍歷：

但是需要對每個marker進行恢復操作，所以需要進行遍歷：

 

  var allOverlay = map.getOverlays();
  for (var i = 0; i < allOverlay.length; i++) {
       allOverlay[i].enableMassClear();
  }

這樣就恢復了所有覆蓋物的可清除操作。

參考文章：https://www.jianshu.com/p/e6ab36f85b5b