"use strict" var keyValue = request('keyValue'); var eOverlays = [];//覆盖物 var showPolygon = []; var map; var drawingManager; var thisPipeLineId;//当前绘制管线ID var editOverlays;//编辑状态的 地图覆盖物 // 新建管网区域 function addPipeArea() { dialogOpen({ id: "Form", title: '新建管网区域', url: '/PipeNetworkManage/PipeMap/PiPeMapForm?keyValue=', width: "750px", height: "500px", callBack: function (iframeId) { top.frames[iframeId].AcceptClick(); } }); } //初始化管网区域信息 function InitialPipeArea() { var areaDate; $.ajax({ type: "Get", async: false, url: "/PipeNetworkManage/PipeMap/GetPipeAreaList", success: function (data) { areaDate = data; }, error: function (xhr, status, error) { } }); $("#pipeAreaList").html(areaDate); //加载所有管线 loadAllPipeLine(); //页面文字信息初始化 InitialPageText(); } //页面文字信息初始化 function InitialPageText() { var areaNum = $(".areaItem").length; var linNum = eOverlays.length; $("#areaNum").text("管网数量:" + areaNum); $("#lineNum").text("管线总数:" + linNum); } function loadAllPipeLine() { //加载所有管线 var lineCoordinates; $.ajax({ type: "Get", async: false, dataType: "json", url: "/PipeNetworkManage/PipeMap/GetAllPipeLine", success: function (data) { lineCoordinates = data; }, error: function (xhr, status, error) { } }); drawPloyLine(lineCoordinates); } //管网线 显示 function showPipeLine(areaId) { $("#west_pipeArea").fadeOut("slow"); $("#west_pipeLine").fadeIn("slow"); //管线数据获取 $("#hid_area_id").val(areaId); pipeLineShow(areaId);//左侧栏 管线信息加载 showAreaPipeLine(areaId); } //加载某一管网区域 所有管线信息 function showAreaPipeLine(areaId) { //var lineCoordinates; //$.ajax({ // type: "Get", // async: false, // dataType: "json", // url: "/PipeNetworkManage/PipeMap/GetPipeLineCoordinates?areaId=" + areaId, // success: function (data) { // lineCoordinates = data; // }, // error: function (xhr, status, error) { // } //}); //drawPloyLine(lineCoordinates); //清空覆盖物 for (var i = 0 ; i < eOverlays.length;i++) { var overLay = eOverlays[i]; map.removeOverlay(overLay.overLay); } //加载这一区域的管线 for (var i = 0 ; i < eOverlays.length; i++) { var overLay = eOverlays[i]; var thisAreaId = overLay.areaId; if (thisAreaId == areaId) { map.addOverlay(overLay.overLay); } } } //左侧栏 管线信息加载 function pipeLineShow(areaId) { var lineDate; $.ajax({ type: "Get", async: false, url: "/PipeNetworkManage/PipeMap/GetPipeLineList?areaId=" + areaId, success: function (data) { lineDate = data; }, error: function (xhr, status, error) { } }); $("#pipeLineList").html(lineDate); } // 绘制管线 function drawPloyLine(data) { eOverlays.length = 0;//初始化 //地图覆盖物增加 for (var i = 0; i < data.length; i++) { var lineId = data[i]["PipeLineId"];//管线ID var Coordinates = data[i]["Coordinates"];//管线坐标 //var lineStyle = data[i]["PipeLineStyle"];//管线样式 var areaId = data[i].PipeAreaId; if (Coordinates.length > 0) { var points = Coordinates.split("|"); var paths = []; for (var j = 0 ; j < points.length; j++) { paths.push(new BMap.Point(points[j].split(",")[0], points[j].split(",")[1])); } //console.log(lineStyle); //var styles = lineStyle.split("-"); //var polyLine = new BMap.Polyline(paths, { strokeColor: styles[0], strokeWeight: styles[2], strokeOpacity: 0.5, strokeStyle: styles[1] == 0 ? "solid" : "dashed" }); var polyLine = new BMap.Polyline(paths, { strokeColor: "#FF0000", strokeWeight: "2", strokeOpacity: 1, strokeStyle: "solid" }); map.addOverlay(polyLine); //信息存储 var thisLine = {}; thisLine.lineId = lineId; thisLine.overLay = polyLine; thisLine.areaId = areaId; eOverlays.push(thisLine); } } } //新建管线 function addPipeLine() { var areaId = $("#hid_area_id").val(); dialogOpen({ id: "Form", title: '新建管线', url: '/PipeNetworkManage/PipeMap/PiPeLineForm?areaId=' + areaId + '&keyValue=', width: "750px", height: "500px", callBack: function (iframeId) { top.frames[iframeId].AcceptClick(); } }); } // 编辑管网区域 function editPipeArea(id) { dialogOpen({ id: "Form", title: '编辑管网区域', url: '/PipeNetworkManage/PipeMap/PiPeMapForm?keyValue=' + id, width: "750px", height: "500px", callBack: function (iframeId) { top.frames[iframeId].AcceptClick(); } }); } function editPipeLine(id) { dialogOpen({ id: "Form", title: '编辑管线信息', url: '/PipeNetworkManage/PipeMap/PipeLineForm?keyValue=' + id, width: "750px", height: "500px", callBack: function (iframeId) { top.frames[iframeId].AcceptClick(); } }); } //// 新建管线 //function addPipeLine() { // dialogOpen({ // id: "Form", // title: '新建管网区域', // url: '/PipeNetworkManage/PipeMap/PiPeLineForm?keyValue=', // width: "750px", // height: "500px", // callBack: function (iframeId) { // top.frames[iframeId].AcceptClick(); // } // }); //} function hideShowArea(id) { var nowClass = $(this).eq(0).attr("class"); if (nowClass.indexOf("glyphicon-eye-open") > 0) { $(this).removeClass("glyphicon-eye-open"); $(this).addClass("glyphicon-eye-close"); } else { $(this).addClass("glyphicon-eye-open"); $(this).removeClass("glyphicon-eye-close"); } } // checkbox change事件监听 function checkBoxChange() { // dma分区是否展示 $("#cdma").change(function (e) { if ($('#cdma').is(':checked')) { showAllDMA(); } else { for (var overlay in overlays) { map.removeOverlay(overlays[overlay]); } if (showPolygon) { map.removeOverlay(showPolygon); } } }); } // 获取中心点 function getCenterPoint(path) { var x = 0.0; var y = 0.0; for (var i = 0; i < path.length; i++) { x = x + parseFloat(path[i].lng); y = y + parseFloat(path[i].lat); } x = x / path.length; y = y / path.length; return { lng: x, lat: y } } // 设置单个区域 function addOnePolygon() { var paths = overlays[PointTreeCode].getPath(); var polygon = new BMap.Polygon(paths, { strokeColor: "red", strokeWeight: 2, strokeOpacity: 1, FillOpacity: "0.0", fillColor: "none" }); map.addOverlay(polygon); showPolygon = polygon; var center = getCenterPoint(paths); map.setZoom(12); map.panTo(new BMap.Point(center.lng, center.lat), 2000); } //点击划线 function DrowOrEditPipeLine(lineId) { //编辑区域出现 $("#btnWrapper").show(); thisPipeLineId = lineId; //样式--选中区域变色--后期增加 } function drow() { drawOne(thisPipeLineId); drawingManager.open();//开启绘制 drawingManager.setDrawingMode(BMAP_DRAWING_POLYLINE);//绘制折线模式 } // 绘制具体界面区域 function drawOne(lineId) { //保存图标显示 $("#btnWrapper .save").show(); var isExists = false; var nowOverlay; //判断此管线是否绘制过 for (var i = 0 ; i < eOverlays.length; i++) { var overLay = eOverlays[i]; if (overLay.lineId == lineId) { isExists = true; nowOverlay = overLay.overLay; } } if (!isExists) { $("#btnWrapper").show(); // 绘制完成调用 var overlaycomplete = function (e) { //$("#drawmap").attr("disabled", "disabled"); var path = e.overlay.getPath();//获取所有点集合 eOverlays.push(e.overlay); var paths = []; for (var i = 0; i < path.length; i++) { paths.push(new BMap.Point(path[i].lng, path[i].lat)); } //var polyLine = new BMap.Polyline(paths, { strokeColor: $("#FillColor").val(), strokeWeight: 2, strokeOpacity: 0.5 }); var polyLine = new BMap.Polyline(paths, { strokeColor: "#FF0000", strokeWeight: 2, strokeOpacity: 1 }); map.addOverlay(polyLine); polyLine.enableEditing(); polyLine.isEdit = true; clearNoEdit(eOverlays); editOverlays = polyLine; }; //var styleOptions = { // strokeColor: "rgb(46, 207, 3)", //边线颜色。 // fillColor: "rgb(46, 207, 3)", //填充颜色。当参数为空时,圆形将没有填充效果。 // strokeWeight: 3, //边线的宽度,以像素为单位。 // strokeOpacity: 0.8, //边线透明度,取值范围0 - 1。 // fillOpacity: 0.6, //填充的透明度,取值范围0 - 1。 // strokeStyle: 'solid' //边线的样式,solid或dashed。 //} //实例化鼠标绘制工具 drawingManager = new BMapLib.DrawingManager(map, { isOpen: false, //是否开启绘制模式 enableDrawingTool: false, //是否显示工具栏 drawingMode: BMAP_DRAWING_POLYLINE,//绘制模式 线 drawingToolOptions: { anchor: BMAP_ANCHOR_TOP_RIGHT, //位置 offset: new BMap.Size(5, 5), //偏离值 drawingModes: [ BMAP_DRAWING_POLYLINE ] }, //polygonOptions: styleOptions //多边形的样式 }); //添加鼠标绘制工具监听事件,用于获取绘制结果 drawingManager.addEventListener('overlaycomplete', overlaycomplete); } else { nowOverlay.enableEditing(); editOverlays = nowOverlay; } } // 清除拖拽区域 function clearNoEdit(overlays) { for (var i = 0; i < overlays.length; i++) { map.removeOverlay(overlays[i]); } overlays.length = 0 } // 获取坐标点 function getlinepoints(polygon) { var pts = polygon.getPath(); var points = ""; for (var i = 0; i < pts.length; i++) { points += pts[i].lng + "," + pts[i].lat; if (i < pts.length - 1) { points += "|" } } return points; } //保存管线坐标 function save() { var linePoints = getlinepoints(editOverlays); editOverlays.isEdit = false; $.ajax({ type: "POST", async: false, url: "/PipeNetworkManage/PipeMap/SavePipeLinePoints", data: { lineId: thisPipeLineId, points: linePoints }, dataType:"json", success: function (data) { dialogMsg(data.message,1); //alert(data); editOverlays.disableEditing(); //保存图标隐藏 $("#btnWrapper .save").hide(); $("#btnWrapper").hide(); }, error: function (xhr, status, error) { } }); } //返回按钮 function showPipeArea() { //管线区域隐藏 $("#west_pipeLine").fadeOut("slow"); $("#west_pipeArea").fadeIn("slow"); //地图管线重新加载 map.clearOverlays(); loadAllPipeLine(); } // 初始化颜色 function InitialColor() { $('.fill_Color').each(function () { $(this).minicolors({ control: $(this).attr('data-control') || 'hue', defaultValue: $(this).attr('data-defaultValue') || '', inline: $(this).attr('data-inline') === 'true', letterCase: $(this).attr('data-letterCase') || 'lowercase', opacity: $(this).attr('data-opacity'), position: $(this).attr('data-position') || 'bottom left', change: function (hex, opacity) { if (!hex) return; if (opacity) hex += ', ' + opacity; try { console.log(hex); } catch (e) { } }, theme: 'bootstrap' }); }); } //初始化页面 function InitialPage() { // 设置 $(".partitionsContainer").css({ "height": ($(window).height() - 80) + "px" }); //layout布局 $('#layout').layout({ applyDemoStyles: true, onresize: function () { $(window).resize(); } }); // resize重设(表格、树形)宽高 $(window).resize(function (e) { window.setTimeout(function () { $("#itemTree").css("min-height", $(window).height() - 100); $("#itemTree_line").css("min-height", $(window).height() - 100); $(".partitionsContainer").css({ "height": ($(window).height() - 80) + "px" }); }, 200); e.stopPropagation(); }); $("#itemTree").css("min-height", $(window).height() - 100); $("#itemTree_line").css("min-height", $(window).height() - 100); //布局宽度重新设置 $(".ui-layout-west").css("width", "300px"); var centerWidht = $(".ui-layout-center").width(); $(".ui-layout-center").css({ "width": centerWidht - 100, "left": "305px" }); $(".ui-layout-resizer").css("display", "none"); } // 初始化百度地图 function initBaiduMap(lat, lgt,zoom) { map = new BMap.Map("allmap"); var geoc = new BMap.Geocoder(); //地址解析对象 var point = new BMap.Point(lat, lgt); map.centerAndZoom(point, zoom); // 中心点 map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放 var bottom_left_control = new BMap.ScaleControl({ anchor: BMAP_ANCHOR_BOTTOM_LEFT });// 左上角,添加比例尺 map.addControl(bottom_left_control); map.addControl(new BMap.MapTypeControl({ mapTypes: [ BMAP_NORMAL_MAP, BMAP_HYBRID_MAP //BMAP_PERSPECTIVE_MAP ], anchor: BMAP_ANCHOR_TOP_LEFT })); } //删除管网区域 function deletePipeArea(areaId) { if (areaId) { $.RemoveForm({ url: "/PipeNetworkManage/PipeMap/DeletePipeArea", param: { areaId: areaId }, success: function (data) { InitialPipeArea(); map.clearOverlays() loadAllPipeLine(); } }) } } //删除管网区域 function deletePipeLine(lineId,areaId) { if (lineId) { $.RemoveForm({ url: "/PipeNetworkManage/PipeMap/DeltePipeLine", param: { lineId: lineId }, success: function (data) { showAreaPipeLine(areaId); map.clearOverlays() loadAllPipeLine(); pipeLineShow(areaId); } }) } }