|  |  | 
 |  |  | <head> | 
 |  |  |     <meta charset="utf-8" /> | 
 |  |  |     <title>方案布点辅助</title> | 
 |  |  |     <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=rER1sgBIcQxkfNSlm2wmBGZGgEERrooM"></script> | 
 |  |  |     <script type="text/javascript" src="/js/jquery.min.js"></script> | 
 |  |  | </head> | 
 |  |  | <link rel="stylesheet" type="text/css" href="/css/default.css"> | 
 |  |  | <link rel="stylesheet" href="/css/Lobibox.min.css"/> | 
 |  |  | <style type="text/css"> | 
 |  |  |     body, | 
 |  |  |     html, | 
 |  |  | 
 |  |  |     #mapCanvas { | 
 |  |  |         width: 100%; | 
 |  |  |         height: 100%; | 
 |  |  |         /* overflow: hidden; */ | 
 |  |  |         /* margin: 0; */ | 
 |  |  |         /* padding: 0; */ | 
 |  |  |         overflow: hidden; | 
 |  |  |         margin: 0; | 
 |  |  |         padding: 0; | 
 |  |  |         z-index: 0; | 
 |  |  |         /* font-size: 14px; */ | 
 |  |  |         /* font-family: "微软雅黑"; */ | 
 |  |  |         font-size: 14px; | 
 |  |  |         font-family: "微软雅黑"; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     .popup-box { | 
 |  |  |         position: absolute; | 
 |  |  |         z-index: 1; | 
 |  |  |         font-size: 14px; | 
 |  |  |         background-color: white; | 
 |  |  |         top: 3%; | 
 |  |  |         left: 1%; | 
 |  |  |         padding: 14px 10px 0px; | 
 |  |  |         text-align: center; | 
 |  |  |         width: 290px; | 
 |  |  |         height: 130px; | 
 |  |  |         width: 280px; | 
 |  |  |         height: 110px; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     .search-box { | 
 |  |  | 
 |  |  |         text-align: left; | 
 |  |  |         padding-left: 2px; | 
 |  |  |     } | 
 |  |  |     input[type="button"] { | 
 |  |  |         cursor: pointer; | 
 |  |  |     } | 
 |  |  |     input[type="radio"] { | 
 |  |  |         cursor: pointer; | 
 |  |  |     } | 
 |  |  | </style> | 
 |  |  | <body> | 
 |  |  | <div class="main-body"> | 
 |  |  |     <div class="popup-box"> | 
 |  |  |         <table> | 
 |  |  | 
 |  |  |     </div> | 
 |  |  |     <div id="mapCanvas"></div> | 
 |  |  | </div> | 
 |  |  |     <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=rER1sgBIcQxkfNSlm2wmBGZGgEERrooM"></script> | 
 |  |  |     <script type="text/javascript" src="/js/jquery.min.js"></script> | 
 |  |  |     <script type="text/javascript" src="/js/lobibox.min.js"></script> | 
 |  |  |  | 
 |  |  | <body> | 
 |  |  |     <script> | 
 |  |  |         var baiduMap; | 
 |  |  |         var markerManager = { | 
 |  |  |             data: {}, | 
 |  |  |             data: { | 
 |  |  |                 _regionName:null, | 
 |  |  |                 _boundary:[], | 
 |  |  |                 _boundaryState:false | 
 |  |  |             }, | 
 |  |  |             bind: {} | 
 |  |  |         }; | 
 |  |  |         markerManager.bindSelect = function (key, select) { | 
 |  |  | 
 |  |  |                     console.log("int markerManager key:" + key + ",don't bind select"); | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         } | 
 |  |  |         markerManager.setRegionName = function (regionName){ | 
 |  |  |             this.data._regionName = regionName; | 
 |  |  |             function getBoundary(regionName){ | 
 |  |  |                 var bdary = new BMap.Boundary(); | 
 |  |  |                 var map = baiduMap; | 
 |  |  |                 bdary.get(regionName, function(rs){       //获取行政区域 | 
 |  |  |                     map.clearOverlays();        //清除地图覆盖物 | 
 |  |  |                     var count = rs.boundaries.length; //行政区域的点有多少个 | 
 |  |  |                     if (count === 0) { | 
 |  |  |                         alert('未能获取当前输入行政区域'); | 
 |  |  |                         return ; | 
 |  |  |                     } | 
 |  |  |                     // var pointArray = []; | 
 |  |  |                     var polygonArray = []; | 
 |  |  |                     for (var i = 0; i < count; i++) { | 
 |  |  |                         var ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2,fillOpacity:0.01,strokeStyle:"dashed",strokeColor: "#0000ff"}); //建立多边形覆盖物 | 
 |  |  |                         // map.addOverlay(ply);  //添加覆盖物 | 
 |  |  |                         // pointArray = pointArray.concat(ply.getPath()); | 
 |  |  |                         polygonArray.push(ply); | 
 |  |  |                     } | 
 |  |  |                     // map.setViewport(pointArray);    //调整视野 | 
 |  |  |                     //addlabel(); | 
 |  |  |                     //设置边界 | 
 |  |  |                     markerManager.data._boundary = polygonArray; | 
 |  |  |                 }); | 
 |  |  |             } | 
 |  |  |              getBoundary(regionName); | 
 |  |  |         } | 
 |  |  |         markerManager.openBoundary = function(){ | 
 |  |  |             debugger; | 
 |  |  |             console.log(this.data._boundary); | 
 |  |  |             if(!!this.data._boundary&&this.data._boundary.length>0){ | 
 |  |  |                 for(var n =0 ;n< this.data._boundary.length;n++){ | 
 |  |  |                     baiduMap.addOverlay(this.data._boundary[n]); | 
 |  |  |                 } | 
 |  |  |                 this.data._boundaryState = true; | 
 |  |  |             } | 
 |  |  |  | 
 |  |  |         } | 
 |  |  |         markerManager.closeBoundary = function(){ | 
 |  |  |             for(var n =0 ;n< this.data._boundary.length;n++){ | 
 |  |  |                 baiduMap.removeOverlay(this.data._boundary[n]); | 
 |  |  |             } | 
 |  |  |             this.data._boundaryState = false; | 
 |  |  |         } | 
 |  |  |         markerManager.isBoundaryState = function() { | 
 |  |  |             return this.data._boundaryState; | 
 |  |  |         } | 
 |  |  |         markerManager.addMarker = function (key, marker) { | 
 |  |  |             this.data[key] = !!this.data[key] ? this.data[key] : []; | 
 |  |  | 
 |  |  |         // 0,无操作,1,增加设备,2,增加五角星,3,删除布点 | 
 |  |  |         function clickHandle(args, key) { | 
 |  |  |             var handleValue = parseInt($("input[name='mapClickHandle']:checked").val()); | 
 |  |  |             var handleName = ""; | 
 |  |  |             switch (handleValue) { | 
 |  |  |                 case 0: | 
 |  |  |                     clickHandle.counter +=1; | 
 |  |  |                     handleName += "无操作"; | 
 |  |  |                     break; | 
 |  |  |                 case 1: | 
 |  |  |                     addMpoint(args.point); | 
 |  |  |                     handleName += "[设备]布点"; | 
 |  |  |                     break; | 
 |  |  |                 case 2: | 
 |  |  |                     addStar(args.point); | 
 |  |  |                     handleName += "[五角星]布点"; | 
 |  |  |                     break; | 
 |  |  |                 case 3: | 
 |  |  |                      handleName += "删除布点"; | 
 |  |  |                     if(this instanceof BMap.Marker){ | 
 |  |  |                         removeOverlay(key,this); | 
 |  |  |                         clickHandle.counter -=1; | 
 |  |  |                     }else{ | 
 |  |  |                         clickHandle.counter +=1; | 
 |  |  |                     } | 
 |  |  |                     removeOverlay(key, this); | 
 |  |  |                     break; | 
 |  |  |             } | 
 |  |  |             if(clickHandle.counter>=4 ){ | 
 |  |  |                 var msg = "当前状态为:【"+handleName+"】,可以通过【鼠标右键】切换状态" | 
 |  |  |                 Lobibox.notify('info', { | 
 |  |  |                     size: 'mini', | 
 |  |  |                     width: 500, | 
 |  |  |                     // delay: false, | 
 |  |  |                     icon: false, | 
 |  |  |                     msg: msg | 
 |  |  |                 }); | 
 |  |  |                 clickHandle.counter = 0; | 
 |  |  |             } | 
 |  |  |  | 
 |  |  |         } | 
 |  |  |         clickHandle.counter = 0; | 
 |  |  |         var switchMenuItems = {}; | 
 |  |  |         switchClickHanld = function (value) { | 
 |  |  |             value = value.toString(); | 
 |  |  |             clickHandle.counter = 0; | 
 |  |  |             $("input[name='mapClickHandle']").each(function () { | 
 |  |  |                 var handleValue = $(this).val().toString(); | 
 |  |  |                 if (handleValue === value) { | 
 |  |  | 
 |  |  |                     } | 
 |  |  |                 }, | 
 |  |  |                 { | 
 |  |  |                     text: '打开边界', | 
 |  |  |                     callback: function () { | 
 |  |  |                         if(!markerManager.isBoundaryState()){ | 
 |  |  |                             markerManager.openBoundary(); | 
 |  |  |                             if(markerManager.isBoundaryState()){ | 
 |  |  |                                 this.setText("关闭边界"); | 
 |  |  |                             }else{ | 
 |  |  |  | 
 |  |  |                             } | 
 |  |  |                         }else { | 
 |  |  |                             markerManager.closeBoundary(); | 
 |  |  |                             this.setText("打开边界"); | 
 |  |  |                         } | 
 |  |  |                     } | 
 |  |  |                 }, | 
 |  |  |                 { | 
 |  |  |                     text: '清空地图', | 
 |  |  |                     callback: function (menuItem) { | 
 |  |  |                         var result = confirm('注意! 注意! 注意! 一旦清除后将无法恢复') | 
 |  |  | 
 |  |  |                 "click", | 
 |  |  |                 clickHandle | 
 |  |  |             ); | 
 |  |  |             map.addEventListener( | 
 |  |  |                 "dblclick", | 
 |  |  |                 function(){ | 
 |  |  |                     clickHandle.counter -=2; | 
 |  |  |                 } | 
 |  |  |             ); | 
 |  |  |             return map; | 
 |  |  |         } | 
 |  |  |         (function ($) { | 
 |  |  | 
 |  |  |                 var searchValue = $('.search-box').val(); | 
 |  |  |                 if (!!searchValue) { | 
 |  |  |                     baiduMap.centerAndZoom(searchValue); | 
 |  |  |                     markerManager.setRegionName(searchValue); | 
 |  |  |                 } | 
 |  |  |             }); | 
 |  |  |             markerManager.bindSelect("mpoint", "#mpointCount"); |