百度地图maker过多,导致卡顿的优化

2019-02-25  本文已影响0人  Pino

原文:https://blog.csdn.net/yzyssg1/article/details/73130679
百度地图的API虽然说覆盖物多了可以用聚合,但聚合使用下来,性能并不好
目前解决方案是,获取地图的左下角和右上角的经纬度,然后根据此经纬度范围,到数据库中搜索,把该区域内的覆盖物取出标注到地图上。
生成地图时绑定事件,在移动和缩放时触发:

Js代码  
 map.addEventListener("moveend", queryInRect);  
//map.addEventListener("moveend", funMoveend);  
          
map.addEventListener("zoomend", queryInRect);  
Js代码  
function queryInRect (event) {  
    //alert(event.type + '==' + event.target);  
      
    var cp = map.getBounds(); // 返回map可视区域,以地理坐标表示  
    var sw = cp.getSouthWest(); // 返回矩形区域的西南角  
    var ne = cp.getNorthEast(); // 返回矩形区域的东北角  
  
    zoom = map.getZoom();  
  
    if (zoom < defaultShowLampZoom) {  
        // 放大级数小于17后,清除所有覆盖物,但百度覆盖物不能删除  
        // 以后做成清除非网关控制器 TODO  
        var markers = getCurrentMarkers();  
        for (var i=0; i<markers.length; i++) {  
            map.removeOverlay(markers[i]);  
        }  
        return;  
    }  
      
    //如果放大到17级别,则取屏幕范围内的标注  
    var param = {  
        swlng : sw.lng,  
        swlat : sw.lat,  
        nelng : ne.lng,  
        nelat : ne.lat  
    };  
    $.ajax( {  
        type : "POST",  
        url : "queryInRect.action",  
        data : param,  
        dataType : "json",  
        success : function(jsonData) {  
            // 把数据加载到地图上去。  
            if (jsonData.rtnMsg) {  
                alert(jsonData.rtnMsg);  
                //window.location.href = "login.html";  
                return;  
            }  
            if (jsonData.controllerList) {  
                // 添加前清空地图上标记物 TODO,应该是有,则不更新,而不是现在全部清空  
                // 但不清空百度地图标记物  
                var markers = getCurrentMarkers();  
                for (var i=0; i<markers.length; i++) {  
                    map.removeOverlay(markers[i]);  
                }  
                  
                $.each(jsonData.controllerList, function(i, controller) {  
                    var point = new BMap.Point(controller.longitude, controller.latitude);  
                    addMarker(point, controller, markers);  
                      
                    // 插入或更新数据采集的taffyDb  
                    insertOrUpdateDataCollection(controller);  
                    // 插入或更新故障信息的taffyDb  
                    insertOrUpdateAlarm(controller);  
                      
                });  
                  
                //如果是树上右击定位而来,0.8秒后设置灯跳跃  
                if (find) {  
                    setTimeout(jumpIcon, 800);  
                }  
            }  
        },  
        error : function(XMLHttpRequest, textStatus, errorThrown) {  
            //if (XMLHttpRequest.status == 12029 && textStatus == "error") {  
            //alert("WEB服务器未启动或已宕机,请联系管理员。");  
            //}  
            alert('服务器异常');  
        }  
    });  
}  
上一篇 下一篇

猜你喜欢

热点阅读