/** * Created by lenovo on 2016/4/13. */ //定义全局变量,缓存组织结构 var Ems = function () { var isSaveStatus = false; var map = null; var readyToUploadPoints = new Array(); var drawOverlays = new Array(); var readyToUploadMarkers = new Array(); var vectorMarkers = []; var handleDatePickers = function () { if (jQuery().datepicker) { $('.date-picker').datepicker({ rtl: App.isRTL() }); } } return { //添加标识器 emsAddCallBack: function () { $('#addModal').modal('show') }, //删除标识器 emsDelCallBack: function () { //绘制矩形区域: if (drawOverlays.length == 0) { alert("请先绘制区域"); return; } var pointArray = new Array(); var readyToDel = ""; for (var i = 0; i < drawOverlays.length; i++) { var layer = drawOverlays[i]; var type = drawOverlays[i].oQ; try { for (var j = 0; j < window.markerData.length; j++) { var emsBean = window.markerData[j]; var bdPoint = gpsBdUtils.gcj2bd(emsBean.latitude, emsBean.longitude); var point = new BMap.Point(bdPoint.longitude, bdPoint.latitude); // var point = new BMap.Point(emsBean.longitude, emsBean.latitude); if (type == "Circle") { if (BMapLib.GeoUtils.isPointInCircle(point, layer)) { pointArray.push(point); readyToDel = readyToDel + emsBean.id + ","; } } else { if (BMapLib.GeoUtils.isPointInPolygon(point, layer)) { pointArray.push(point); readyToDel = readyToDel + emsBean.id + ","; } } } } catch (e) { alert(e); } if (pointArray.length <= 0) { alert("选择区域没有要删除的点..."); for (var i in drawOverlays) { map.removeOverlay(drawOverlays[i]); } return; } if(confirm("删除是不可恢复的,你确认要删除吗?")){ //删除操作: $.ajax({ type: "get", url: $('#context').val() + "/marker/delMarkerByIds.do", dataType: "json", cache: false, data: { "ids": readyToDel }, success: function (r) { if (r.success) {//请求成功 window.markerData = []; location.href = $('#context').val() + "/content/ems/ems.jsp"; } }, error: function (d) {//请求出错 alert(d.responseText); } }); }else{ for (var i in drawOverlays) { map.removeOverlay(drawOverlays[i]); } return; } } }, //保存标识器 emsSaveCallBack: function () { if(readyToUploadPoints.length==0){ return; } if(isSaveStatus){ alert("保存过于频繁,请稍后操作!"); return; } isSaveStatus = true; //TODO LIST:上传 var uploadMaker = new Array(); var pointArray = new Array(); for (var i = 0; i < readyToUploadPoints.length; i++) { var emsBean = readyToUploadPoints[i].Tag; var lng = readyToUploadPoints[i].point.lng; var lat = readyToUploadPoints[i].point.lat; var gpsPoint = gpsBdUtils.bd2gcj(lat, lng); emsBean.longitude = gpsPoint.longitude; emsBean.latitude = gpsPoint.latitude; if (!emsBean.depth) { emsBean.depth = 0; } uploadMaker.push(emsBean); var point = new BMap.Point(lng, lat); pointArray.push(point); } $.ajax({ type: "get", url: $('#context').val() + "/marker/batchSave.do", dataType: "json", cache: false, data: { markers: JSON.stringify(uploadMaker) }, success: function (r) { if (r.success) {//请求成功 window.markerData = []; readyToUploadPoints = []; map.setViewport(pointArray); Ems.clearOverlays(); isSaveStatus = false; } }, error: function (d) {//请求出错 alert(d.responseText); isSaveStatus = false; } }); }, emsUploadCallBack: function () { // map.zoomTo(map.getZoom() + 2); //TODO LIST:弹出对应的对话框 $('#uploadModal').modal('show') }, emsExportCallBack: function () { //TODO LIST:选择导出的文件 // map.zoomTo(map.getZoom() + 2); location.href = $('#context').val() + "/marker/export.do"; }, clearOverlays: function () { for (var i = 0; i < drawOverlays.length; i++) { map.removeOverlay(drawOverlays[i]); } for (var i = 0; i < readyToUploadMarkers.length; i++) { map.removeOverlay(readyToUploadMarkers[i]); } readyToUploadPoints = []; drawOverlays = []; readyToUploadMarkers = []; }, initMap: function () { map = new BMap.Map("container"); // 创建地图实例 //右键删除操作 var menu = new BMap.ContextMenu(); var txtMenuItem = [ { text: '删除', callback: function (e) { //判断右键位置是否在覆盖物内,如果在就删除覆盖物 for (var i = 0; i < drawOverlays.length; i++) { var layer = drawOverlays[i]; if (BMapLib.GeoUtils.isPointInPolygon(e, layer) || BMapLib.GeoUtils.isPointInRect(e, layer)||BMapLib.GeoUtils.isPointInCircle(e, layer)) { map.removeOverlay(drawOverlays[i]); drawOverlays.splice(i, 1); } } } } ]; for (var i = 0; i < txtMenuItem.length; i++) { menu.addItem(new BMap.MenuItem(txtMenuItem[i].text, txtMenuItem[i].callback, 100)); } map.addContextMenu(menu); var myFun = function (result) {//根据城市名进行定位 var cityName = result.name; map.setCenter(cityName); } //声明全局变量 if (!window.markerData || window.markerData.length == 0) { window.markerData = new Array(); } var point = new BMap.Point(116.404, 39.915); // 创建点坐标 map.centerAndZoom(point, 17); // 初始化地图,设置中心点坐标和地图级别 var myCity = new BMap.LocalCity(); myCity.get(myFun); map.enableScrollWheelZoom(); //启用地图滚轮放大缩小 var ctrl_ove = new BMap.OverviewMapControl({ anchor: BMAP_ANCHOR_BOTTOM_RIGHT }); map.addControl(ctrl_ove); //向地图中添加比例尺控件 var ctrl_sca = new BMap.ScaleControl({ anchor: BMAP_ANCHOR_BOTTOM_LEFT }); map.addControl(ctrl_sca); //创建标识器删除按钮 var addImage = $('#context').val() + "/images/ems/emsAdd.png"; var offset0 = new BMap.Size(10, 100); var emsAddControl = new EmsControl(map, addImage, Ems.emsAddCallBack, offset0, "新增标识器"); map.addControl(emsAddControl); //删除标识器 var delImage = $('#context').val() + "/images/ems/emsDel.png"; var offset1 = new BMap.Size(10, 170); var emsDelControl = new EmsControl(map, delImage, Ems.emsDelCallBack, offset1, "删除标识器"); map.addControl(emsDelControl); //保存标识器 var saveImage = $('#context').val() + "/images/ems/emsSave.png"; var offset_save = new BMap.Size(10, 240); var emsSaveControl = new EmsControl(map, saveImage, Ems.emsSaveCallBack, offset_save, "保存标识器"); map.addControl(emsSaveControl); //批量导入标识器数据,弹出对应的对话框 var uploadImage = $('#context').val() + "/images/ems/emsUpload.png"; var offset2 = new BMap.Size(10, 310); var emsUploadControl = new EmsControl(map, uploadImage, Ems.emsUploadCallBack, offset2, "批量导入"); map.addControl(emsUploadControl); //批量导出标识器数据,弹出对应的对话框 var exportImage = $('#context').val() + "/images/ems/emsExport.png"; var offset3 = new BMap.Size(10, 380); var emsExportControl = new EmsControl(map, exportImage, Ems.emsExportCallBack, offset3, "导出Excel"); map.addControl(emsExportControl); var clearImage = $('#context').val() + "/images/ems/clear.png"; var offset4 = new BMap.Size(10, 450); var emsClearControl = new EmsControl(map, clearImage, Ems.clearOverlays, offset4, "清空"); map.addControl(emsClearControl); var offset5 = new BMap.Size(10, 10); var emsEditControl = new EmsEditControl(map, offset5); map.addControl(emsEditControl); //添加绘制工具 var overlaycomplete = function (e) { e.overlay.enableEditing(); drawOverlays.push(e.overlay); drawingManager.close(); }; //实例化鼠标绘制工具 var drawingManager = new BMapLib.DrawingManager(map, { isOpen: false, //是否开启绘制模式 enableDrawingTool: true, //是否显示工具栏 drawingToolOptions: { anchor: BMAP_ANCHOR_TOP_LEFT, //位置 offset: new BMap.Size(5, 5), //偏离值 drawingModes: [ BMAP_DRAWING_CIRCLE, BMAP_DRAWING_POLYGON, BMAP_DRAWING_RECTANGLE ] } }); //添加鼠标绘制工具监听事件,用于获取绘制结果 drawingManager.addEventListener('overlaycomplete', overlaycomplete); //加载完毕请求标识点信息 map.addEventListener("tilesloaded", function () { if (window.markerData.length == 0) { $.ajax({ type: "get", url: $('#context').val() + "/marker/all-point-list.do", dataType: "json", // async:false, cache: false, success: function (r) { if (r.data) {//请求成功,将获取到的数据加载到地图上 //1.解析返回的结果,.设置全局变量data的值 window.markerData = [];//清空原来的数据 for (var t = 0; t < r.data.length; t++) { var markerDto = r.data[t]; var emsBean = new EMSBean(markerDto.markerObjectType, markerDto.pipeMaterial, markerDto.pipeDiameter, markerDto.layStyle, markerDto.depth, markerDto.belowType, markerDto.belowDepth, markerDto.belowDiameter, markerDto.belowMaterial, markerDto.road, markerDto.constructTime, markerDto.ownerComp, markerDto.markerObjectId, markerDto.markerId, markerDto.markerType, markerDto.markerDepth, markerDto.creator, markerDto.createTime, markerDto.memo, markerDto.latitude, markerDto.longitude, markerDto.recordType, markerDto.id,markerDto.line,markerDto.area); window.markerData[t] = emsBean; } //2.增加marker Ems.addMarker(window.markerData); } }, error: function (d) {//请求出错 alert(d.responseText); } }); } else { Ems.addMarker(window.markerData); } }); }, initForm: function () { handleDatePickers(); $("#selectObjectType").chosen(); $("#resetEms").live("click", function (e) { $("#markerObjectType").val(""); $("#pipeDiameter").val(""); $("#pipeMaterial").val(""); $("#belowPipeType").val(""); $("#belowPipeDepth").val(""); $("#belowPipeDiameter").val(""); $("#belowPipeMaterial").val(""); $("#pipeDepth").val(""); $("#layStyle").val(""); $("#line").val(""); $("#area").val(""); $("#road").val(""); $("#constructTime").val(""); $("#ownerComp").val(""); $("#markerObjectId").val(""); $("#markerId").val(""); $("#markerType").val(""); $("#markerDepth").val(""); $("#creator").val(""); $("#memo").val(""); }); $('#localize').click(function (e) { $('#addModal').modal('hide'); //注册地图点击事件 function showInfo(e) { map.removeEventListener("click", showInfo); var lng = e.point.lng; var lat = e.point.lat; // var gpsPoint = gpsBdUtils.bd2gcj(lat, lng); //TODO LIST:获取填写表单的信息 所属区域也需要保存的 var selectObjectType = $("#selectObjectType").val();//判断是哪个类别 var markerObjectType = $("#markerObjectType").val(); var pipeDiameter = $("#pipeDiameter").val(); var pipeMaterial = $("#pipeMaterial").val(); var belowPipeType = $("#belowPipeType").val(); var belowPipeDepth = $("#belowPipeDepth").val(); var belowPipeDiameter = $("#belowPipeDiameter").val(); var belowPipeMaterial = $("#belowPipeMaterial").val(); var pipeDepth = $("#pipeDepth").val(); var layStyle = $("#layStyle").val(); var road = $("#road").val(); var constructTime = $("#constructTime").val(); var ownerComp = $("#ownerComp").val(); var markerObjectId = $("#markerObjectId").val(); var markerId = $("#markerId").val(); var markerType = $("#markerType").val(); var markerDepth = $("#markerDepth").val(); var creator = $("#creator").val(); var memo = $("#memo").val(); var line = $("#line").val(); var area = $("#area").val(); var emsBean = new EMSBean(markerObjectType, pipeMaterial, pipeDiameter, layStyle, pipeDepth, belowPipeType, belowPipeDepth, belowPipeDiameter, belowPipeMaterial, road, constructTime, ownerComp, markerObjectId, markerId, markerType, markerDepth, creator, null, memo, lat, lng, selectObjectType,null,line,area); var marker = new BMap.Marker(new BMap.Point(lng, lat)); // 创建点 marker.addEventListener("click", attribute); marker.Tag = emsBean; map.addOverlay(marker); //增加点 marker.enableDragging(); readyToUploadMarkers.push(marker); readyToUploadPoints.push(marker); function attribute() { var emsBean2 = marker.Tag; var searchInfoWindow = null; var msg = ""; var height = 0; if (selectObjectType == 1) { msg = msg + "管线种类:" + emsBean2.markerObjectType + "<br/>" + "管线直径:" + emsBean2.pipeDiameter + "<br/>" + "管线材质:" + emsBean2.pipeMaterial + "<br/>" + "埋设方式:" + emsBean2.layStyle + "<br/>" + "管线埋深:" + emsBean2.depth + "<br/>"; height = 100; } else if (selectObjectType == 2) { msg = msg + "附属物名称:" + emsBean2.markerObjectType + "<br/>" + "井深:" + emsBean2.depth + "<br/>"; height = 40; } else if (selectObjectType == 3) { msg = msg + "管点特征:" + emsBean2.markerObjectType + "<br/>" + "特征点埋深:" + emsBean2.depth + "<br/>"; height = 40; } else { msg = msg + "上层管种类:" + emsBean2.markerObjectType + "<br/>" + "上层管埋深:" + emsBean2.depth + "<br/>" + "上层管直径:" + emsBean2.pipeDiameter + "<br/>" + "上层管材料:" + emsBean2.pipeMaterial + "<br/>" + "下层管种类:" + emsBean2.belowType + "<br/>" + "下层管埋深:" + emsBean2.belowDepth + "<br/>"+ "下层管直径:" + emsBean2.belowDiameter + "<br/>" + "下层管材料:" + emsBean2.belowMaterial + "<br/>" ; height = 160; } height = height + 185; var msg = msg + "所属区域:" + emsBean2.area + "<br/>" + "所属线路:" + emsBean2.line + "<br/>" + "所属道路:" + emsBean2.road + "<br/>" + "建设年代:" + emsBean2.constructTime + "<br/>" + "权属单位:" + emsBean2.ownerComp + "<br/>" + "标识器ID:" + emsBean2.markerId + "<br/>" + "标识器类型:" + emsBean2.markerType + "<br/>" + "标识器埋深:" + emsBean2.markerDepth + "<br/>" + "备注:" + emsBean2.memo + "<br/>"; var imgUrl = $('#context').val() + "/images/ems.jpg"; var content = '<div style="margin:0;line-height:20px;padding:2px;">' + '<img src=' + '"' + imgUrl + '"' + ' alt="" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>' + msg + '</div>'; searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, { title: emsBean.markerName, //标题 width: 290, //宽度 height: height, //高度 panel: "panel", //检索结果面板 enableAutoPan: true //自动平移 }); searchInfoWindow.open(marker.getPosition()); } } map.addEventListener("click", showInfo); }); $("#searchMarker").click(function (e) { var Marker = {}; if (vectorMarkers.length != 0) { for (var i = 0; i < vectorMarkers.length; i++) map.removeOverlay(vectorMarkers[i]); } vectorMarkers = []; Marker.road = $("#roadCondition").val(); Marker.memo = $("#memoCondition").val(); Marker.area = $("#select_area").val(); Marker.line = $("#select_line").val(); Marker.ownerComp = $("#company").val(); Marker.creator = $("#department").val(); Marker.sDate = $("#txt_begin_day").val(); Marker.eDate = $("#txt_end_day").val(); //请求后台的id列表,然后遍历marker列表,修改marker的颜色 $.ajax({ type: "POST", url: $('#context').val() + "/marker/getMarkerListByCondition.do", data: {"strMarkerDto": JSON.stringify(Marker)}, dataType: "json", success: function (r) { if (r.data) { var pointArray = new Array(); if (r.data.length > 1000) { alert("有超过一千个点符合筛选条件,会造成浏览器卡顿,请重新选择"); } else { if (r.data.length == 0) { alert("没有搜到符合条件的标识器"); return; } for (var a in r.data) {//遍历列表,添加marker var bdpoint = gpsBdUtils.gcj2bd(r.data[a].latitude, r.data[a].longitude); var point = new BMap.Point(bdpoint.longitude, bdpoint.latitude); var vectorMarker = new BMap.Marker(new BMap.Point(point.lng, point.lat), { // 指定Marker的icon属性为Symbol icon: new BMap.Symbol(BMap_Symbol_SHAPE_POINT, { scale: 1,//图标缩放大小 fillColor: "green",//填充颜色 fillOpacity: 0.8//填充透明度 }) }); vectorMarkers.push(vectorMarker); map.addOverlay(vectorMarker); pointArray.push(point); } map.setViewport(pointArray); } } }, error: function (request) { //提示错误信息 alert(r.message); } }); }); //控制不同种类对象的标签信息显示 $("#selectObjectType").die().live("change", function (e) { var type = $("#selectObjectType").val(); OptionItemProcess.initPipeTypeList(type); if (type == 1) {//管线 $("#pipeTypeLabel").text("管线种类"); $(".up-pipe").show(); $("#pipeDiameterLabel").text("管线直径"); $("#pipeMaterialLabel").text("管线材质"); $(".below").addClass("hidden"); $("#pipeDepthLabel").text("管线埋深"); $(".pipeOnly").show(); } else if (type == 2) {//管线附属物 $("#pipeTypeLabel").text("附属物名称"); $(".up-pipe").hide(); $(".below").addClass("hidden"); $("#pipeDepthLabel").text("井深"); $(".pipeOnly").hide(); } else if (type == 3) {//管线特征点 $("#pipeTypeLabel").text("管点特征"); $(".up-pipe").hide(); $(".below").addClass("hidden"); $("#pipeDepthLabel").text("特征点埋深"); $(".pipeOnly").hide(); } else {//交叉穿越点 $("#pipeTypeLabel").text("上层管种类"); $(".up-pipe").show(); $("#pipeDiameterLabel").text("上层管直径"); $("#pipeMaterialLabel").text("上层管材料"); $(".below").removeClass("hidden"); $("#pipeDepthLabel").text("上层管埋深"); $(".pipeOnly").hide(); } }); OptionItemProcess.initPipeTypeList($("#selectObjectType").val()); OptionItemProcess.initBelowPipeTypeList(); OptionItemProcess.initAreaList(); OptionItemProcess.initLayStyleList(); OptionItemProcess.initMaterialList(); }, initSelect: function () { $("#selectObjectType").chosen(); }, addMarker: function (data) { if (document.createElement('canvas').getContext) { // 判断当前浏览器是否支持绘制海量点 var points = []; // 添加海量点数据 for (var i = 0; i < data.length; i++) { var bdPoint = gpsBdUtils.gcj2bd(data[i].latitude, data[i].longitude); var point = new BMap.Point(bdPoint.longitude, bdPoint.latitude); point.Tag = data[i]; points.push(point); } var options = { size: BMAP_POINT_SIZE_NORMAL, shape: BMAP_POINT_SHAPE_WATERDROP, color: '#009acd' }; var pointCollection = new BMap.PointCollection(points, options); // 初始化PointCollection pointCollection.addEventListener('click', function (e) { var emsBean = e.point.Tag; var searchInfoWindow = null; var msg = ""; var height = 0; var titleName =""; if (emsBean.recordType == 1) { msg = msg + "管线种类:" + emsBean.markerObjectType + "<br/>" + "管线直径:" + emsBean.pipeDiameter + "<br/>" + "管线材质:" + emsBean.pipeMaterial + "<br/>" + "埋设方式:" + emsBean.layStyle + "<br/>" + "管线埋深:" + emsBean.depth + "<br/>"; height = 100; titleName = "管线" } else if (emsBean.recordType == 2) { msg = msg + "附属物名称:" + emsBean.markerObjectType + "<br/>" + "井深:" + emsBean.depth + "<br/>"; height = 40; titleName = "管线附属物" } else if (emsBean.recordType == 3) { msg = msg + "管点特征:" + emsBean.markerObjectType + "<br/>" + "特征点埋深:" + emsBean.depth + "<br/>"; height = 40; titleName = "管线特征管点" } else { msg = msg + "上层管种类:" + emsBean.markerObjectType + "<br/>" + "上层管埋深:" + emsBean.depth + "<br/>" + "上层管直径:" + emsBean.pipeDiameter + "<br/>" + "上层管材料:" + emsBean.pipeMaterial + "<br/>" + "下层管种类:" + emsBean.belowType + "<br/>" + "下层管埋深:" + emsBean.belowDepth + "<br/>"+ "下层管直径:" + emsBean.belowDiameter + "<br/>" + "下层管材料:" + emsBean.belowMaterial + "<br/>" ; height = 160; titleName = "交叉穿越点" } height = height +225; var msg = msg +"所属区域:" + emsBean.area + "<br/>" + "所属线路:" + emsBean.line + "<br/>" + "所属道路:" + emsBean.road + "<br/>" + "建设年代:" + emsBean.constructTime + "<br/>" + "权属单位:" + emsBean.ownerComp + "<br/>" + "标识器ID:" + emsBean.markerId + "<br/>" + "标识器类型:" + emsBean.markerType + "<br/>" + "标识器埋深:" + emsBean.markerDepth + "<br/>" + "安装部门:" + emsBean.creator + "<br/>" + "最后修改时间:"+emsBean.createTime + "<br/>" + "备注:" + emsBean.memo + "<br/>"; var imgUrl = $('#context').val() + "/images/ems.jpg"; var content = '<div style="margin:0;line-height:20px;padding:2px;">' + '<img src=' + '"' + imgUrl + '"' + ' alt="" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>' + msg + '</div>'; searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, { title: titleName, //标题 width: 290, //宽度 height: height, //高度 panel: "panel", //检索结果面板 enableAutoPan: true //自动平移 }); searchInfoWindow.open(e.point); $(".BMapLib_search_text").css("padding", "0"); $(".BMapLib_search_text").css("margin-bottom", "0"); $(".BMapLib_trans_text").css("padding", "0"); $(".BMapLib_trans_text").css("margin-bottom", "0"); }); map.addOverlay(pointCollection); // 添加Overlay } else { alert('请在chrome、safari、IE8+以上浏览器查看本示例'); } } }; }();