|  |  |  | 
|---|
|  |  |  | <div class="charts_btn"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="search_box"> | 
|---|
|  |  |  | <!-- <div class="search_box"> | 
|---|
|  |  |  | <button id="searchBtn" type="button">搜索</button> | 
|---|
|  |  |  | <input id="searchParam"/> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div id="popup_box"> | 
|---|
|  |  |  | </div> --> | 
|---|
|  |  |  | <!-- <div id="popup_box"> | 
|---|
|  |  |  | <div id="equ_list" class="listview"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> --> | 
|---|
|  |  |  | <div id="mapCanvas"></div> | 
|---|
|  |  |  | <div id="mapParams" style="display: none;"> | 
|---|
|  |  |  | ${requestScope.mapParams} | 
|---|
|  |  |  | 
|---|
|  |  |  | if(!!mapType && !!eval(mapType)) { | 
|---|
|  |  |  | mapOption["mapType"] = eval(mapType); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | var showZoom = getUrlParam("showZoom"); | 
|---|
|  |  |  | //通过地区名称加载地图 | 
|---|
|  |  |  | moralMap.mapInit(params["regionName"],mapOption); | 
|---|
|  |  |  | moralMap.mapInit(params["regionName"],mapOption,showZoom); | 
|---|
|  |  |  | //列表对象 | 
|---|
|  |  |  | var listView  =moralMap.initListView({id: "#equ_list",pageSize:12}); | 
|---|
|  |  |  | window["listView"] = listView; | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var params = moralMap['params']; | 
|---|
|  |  |  | var mpoint = obj.currentTarget.getOption(); | 
|---|
|  |  |  | $("#searchParam").val(mpoint['name']); | 
|---|
|  |  |  | //$("#searchParam").val(mpoint['name']); | 
|---|
|  |  |  | var url = 'get-devices-by-mid-oid?mpId=' + mpoint['id'] + "&orgId=" + params['orgId']; | 
|---|
|  |  |  | listView.load(url); | 
|---|
|  |  |  | moralMap.showPopupbox("#popup_box"); | 
|---|
|  |  |  | 
|---|
|  |  |  | var maxBounds = moralMap.getMaxBounds(); | 
|---|
|  |  |  | var paramMap = {}; | 
|---|
|  |  |  | paramMap["orgId"]=  params['orgId']; | 
|---|
|  |  |  | paramMap["regionCode"]=  params['regionCode']; | 
|---|
|  |  |  | // 为了适配旧接口 | 
|---|
|  |  |  | paramMap["Fe"]=  maxBounds.northeastLat;//东北角纬度,大一点 | 
|---|
|  |  |  | paramMap["Ge"]=  maxBounds.northeastLng;//东北角经度,大一点 | 
|---|
|  |  |  | 
|---|
|  |  |  | obj['mouseover'] = function (type) { | 
|---|
|  |  |  | if(type.target.getData()==null){ | 
|---|
|  |  |  | //当前设备数据为空时,设备悬停事件中 刷新一下数据 | 
|---|
|  |  |  | refreshAllState(); | 
|---|
|  |  |  | //refreshAllState(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | obj['click'] = function(){ | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | var equStr = JSON.stringify(equ); | 
|---|
|  |  |  | if(window["console"]!=undefined){ | 
|---|
|  |  |  | console.log(equStr); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if(!!window['external']&&!!window['external']['callWin']){ | 
|---|
|  |  |  | window['external'].callWin(equStr); | 
|---|
|  |  |  | 
|---|
|  |  |  | paramMap["Ke"]=  bounds.southwestLat;//西北角纬度坐标,小一点 | 
|---|
|  |  |  | paramMap["Le"]=  bounds.southwestLng;//西北角经度坐标,小一点 | 
|---|
|  |  |  | loadLazy("getMonitorpointList",paramMap,addOverMpoints); | 
|---|
|  |  |  | startRefreshPage(); | 
|---|
|  |  |  | //startRefreshPage(); | 
|---|
|  |  |  | showGrid(); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | //地图加载完成后 加载监控点,速度慢 | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | //map为地图对象 | 
|---|
|  |  |  | // TODO 临时 | 
|---|
|  |  |  | function bs() { | 
|---|
|  |  |  | function getBounds() { | 
|---|
|  |  |  | var bs = moralMap.getBounds();  //获取当前地图范围的经纬度 | 
|---|
|  |  |  | // var bssw = bs.getSouthWest();      //获取西南角的经纬度(左下端点) | 
|---|
|  |  |  | // var bsne = bs.getNorthEast();      //获取东北角的经纬度(右上端点) | 
|---|
|  |  |  | if(!getBounds.topLeftAnchor){ | 
|---|
|  |  |  | getBounds.topLeftAnchor = {}; | 
|---|
|  |  |  | getBounds.topLeftAnchor.x0 =  bs.southwestLng; | 
|---|
|  |  |  | getBounds.topLeftAnchor.y0 =  bs.northeastLat; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | return { 'x1': bs.southwestLng, 'y1': bs.southwestLat, 'x2': bs.northeastLng, 'y2': bs.northeastLat }; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | 
|---|
|  |  |  | $(".tools_box").hide(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // if(!isShowGrid||moralMap.getZoom()<14){ | 
|---|
|  |  |  | if(!isShowGrid){ | 
|---|
|  |  |  | if(!isShowGrid||moralMap.getZoom()<14){ | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | var XY = bs(); | 
|---|
|  |  |  | var XY = getBounds(); | 
|---|
|  |  |  | var polygons = []; | 
|---|
|  |  |  | console.log(XY); | 
|---|
|  |  |  | for (var i = XY.x1; i < XY.x2; i = i + 0.0063) { | 
|---|
|  |  |  | for (var j = XY.y2; j > XY.y1; j = j - 0.0048) { | 
|---|
|  |  |  | var X1 = XY.x1; | 
|---|
|  |  |  | var Y2 = XY.y2; | 
|---|
|  |  |  | var X0 = getBounds.topLeftAnchor.x0; | 
|---|
|  |  |  | var Y0 = getBounds.topLeftAnchor.y0; | 
|---|
|  |  |  | var width = 0.0063; | 
|---|
|  |  |  | var height = 0.0048; | 
|---|
|  |  |  | // var multiple = 1000000; | 
|---|
|  |  |  | if(!!getBounds.topLeftAnchor) { | 
|---|
|  |  |  | X1=X0 + Math.ceil((X1-X0)/width-1)*width; | 
|---|
|  |  |  | Y2=Y0 + Math.ceil((Y2-Y0)/height)*height; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | for (var i = X1; i < XY.x2; i = i + width) { | 
|---|
|  |  |  | for (var j = Y2; j > XY.y1; j = j - height) { | 
|---|
|  |  |  | //此类表示绘制一个多边形覆盖物(注意:一定要下面的Point列表为多变形的顶点,描线顺序为从上到下,从左到右,顺序乱了,绘制出来的多边形也会乱,如图二所示,图二是将顶点的顺序给错了(网格左上端点,网格左下端点,网格右上端点,网格右下端点)) | 
|---|
|  |  |  | var polygon = new BMap.Polygon([ | 
|---|
|  |  |  | new BMap.Point(i, j),    //网格左上端点 | 
|---|
|  |  |  | new BMap.Point(i, j-0.0048),  //网格左下端点 | 
|---|
|  |  |  | new BMap.Point(i+0.0063, j-0.0048),    //网格右下端点 | 
|---|
|  |  |  | new BMap.Point(i+0.0063, j)         //网格右上端点 | 
|---|
|  |  |  | ], {strokeColor:"blue", strokeWeight:2, strokeOpacity:1, fillOpacity:0.1}); | 
|---|
|  |  |  | new BMap.Point(i, j-height),  //网格左下端点 | 
|---|
|  |  |  | new BMap.Point(i+width, j-height),    //网格右下端点 | 
|---|
|  |  |  | new BMap.Point(i+width, j)         //网格右上端点 | 
|---|
|  |  |  | ], {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5, fillOpacity:0.1}); | 
|---|
|  |  |  | // polygon .addEventListener("click",function clickFunction(){ | 
|---|
|  |  |  | //     alert("你居然敢点我"); | 
|---|
|  |  |  | // }); | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 点击事件关闭 弹窗列表 | 
|---|
|  |  |  | moralMap.addEventListener("click", function(type, target) { | 
|---|
|  |  |  | moralMap.closePopupbox("#popup_box"); | 
|---|
|  |  |  | //moralMap.closePopupbox("#popup_box"); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | //地图放大缩小事件时,关闭弹窗 | 
|---|
|  |  |  | moralMap.addEventListener('zoomstart', function(type) {}); | 
|---|
|  |  |  | 
|---|
|  |  |  | }else{ | 
|---|
|  |  |  | loadOverlays("get-monitorpoints",addOverMpoints); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | moralMap.closePopupbox("#popup_box"); | 
|---|
|  |  |  | //moralMap.closePopupbox("#popup_box"); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | moralMap.addEventListener('moveend', function(type) { | 
|---|
|  |  |  | var endZoom = this.getZoom(); | 
|---|
|  |  |  | 
|---|
|  |  |  | }else{ | 
|---|
|  |  |  | loadOverlays("get-monitorpoints",addOverMpoints); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | moralMap.closePopupbox("#popup_box"); | 
|---|
|  |  |  | //moralMap.closePopupbox("#popup_box"); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | //搜索框单击事件 | 
|---|
|  |  |  | $("#searchBtn").click( | 
|---|
|  |  |  | function(e) { | 
|---|
|  |  |  | var param = encodeURI($("#searchParam").val()); | 
|---|
|  |  |  | moralMap.showPopupbox("#popup_box"); | 
|---|
|  |  |  | //moralMap.showPopupbox("#popup_box"); | 
|---|
|  |  |  | var url = 'get-devices-for-popup?name=' + param + "&orgId=" + params['orgId']; | 
|---|
|  |  |  | listView.load(url); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | //刷新页面 | 
|---|
|  |  |  | function refreshAllState() { | 
|---|
|  |  |  | var parma={}; | 
|---|
|  |  |  | if(moralMap.isPopupBoxShow("#popup_box")) { | 
|---|
|  |  |  | /* if(moralMap.isPopupBoxShow("#popup_box")) { | 
|---|
|  |  |  | var popupEquMacs = moralMap.getPopupEquMacs(); | 
|---|
|  |  |  | if(popupEquMacs!=null&&popupEquMacs.length>0){ | 
|---|
|  |  |  | parma["popupEquMacs"] = popupEquMacs; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } */ | 
|---|
|  |  |  | //从缓存取 | 
|---|
|  |  |  | var oldMarkerList = moralMap.getHorizonMarkers(true); | 
|---|
|  |  |  | var markerKeys = []; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var equ = { | 
|---|
|  |  |  | methodName : 'refreshState', | 
|---|
|  |  |  | markers : markers, | 
|---|
|  |  |  | layer : layer | 
|---|
|  |  |  | } | 
|---|
|  |  |  | var equStr = JSON.stringify(equ); | 
|---|
|  |  |  | if(window["console"]!=undefined){ | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if(!!window['external']&&!!window['external']['callWin']){ | 
|---|
|  |  |  | window['external'].callWin(equStr); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if(resultMap["popupEquStates"]!=null){ | 
|---|
|  |  |  | listView.refreshState(resultMap["popupEquStates"]); | 
|---|
|  |  |  | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function callJS(jsonData){ | 
|---|
|  |  |  | var jsonData = JSON.parse(jsonData); | 
|---|
|  |  |  | var methodName = jsonData.methodName; | 
|---|
|  |  |  | if("JumpBaiduMap" == methodName){ | 
|---|
|  |  |  | moralMap.callJS(jsonData); | 
|---|
|  |  |  | } else if ("RefreshState" == methodName) { | 
|---|
|  |  |  | //$("#searchParam").val(JSON.stringify(jsonData)); | 
|---|
|  |  |  | var states = jsonData.states; | 
|---|
|  |  |  | moralMap.refreshState(states); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|