百度地图上的标注物太多导致界面卡顿的解决办法

百度地图的API虽然说覆盖物多了可以用聚合，但聚合使用下来，性能并不好

目前解决方案是，获取地图的左下角和右上角的经纬度，然后根据此经纬度范围，到数据库中搜索，把该区域内的覆盖物取出标注到地图上。

 

生成地图时绑定事件，在移动和缩放时触发：

 map.addEventListener("moveend", queryInRect);
//map.addEventListener("moveend", funMoveend);

map.addEventListener("zoomend", queryInRect);

 

 

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('服务器异常');
        }
    });
}