| | |
| | | //当前处警员是否已有电子围栏 |
| | | isEngineer: false, |
| | | |
| | | //是否可编辑 |
| | | isEdit: false, |
| | | |
| | | // 用来记录巡逻区域或者巡逻路线的下标的 |
| | | patrolIndex: 0, |
| | | |
| | |
| | | y: 0, |
| | | offset: null, |
| | | moveThis: null, |
| | | |
| | | //编辑工具激活后为true |
| | | editToolbarStatus: false, |
| | | |
| | | //基础路径 |
| | | //pathUrl: "http://localhost:89", |
| | |
| | | var that = this; |
| | | |
| | | //删除电子围栏点击事件 |
| | | $(".mapBtn .delete").click(function() { |
| | | $(".mapBtn .delBtn").click(function() { |
| | | if (!that.isEngineer) { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('请先新增电子围栏信息!') |
| | | }) |
| | | return; |
| | | } |
| | | //需选中电子围栏,然后进行删除 |
| | | layer.confirm('是否确认删除', { |
| | | btn: ['确定', '取消'], //按钮 |
| | |
| | | }) |
| | | |
| | | //新增电子围栏 |
| | | $('.mapBtn .insert').click(function() { |
| | | $('.mapBtn .insBtn').click(function() { |
| | | //修改按钮样式 |
| | | $("#insertEngineeringMap").css("color", "#3385FF") |
| | | //判断 |
| | | if (that.isEngineer) { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('已存在电子围栏'); |
| | | }) |
| | | layui.layer.msg('已存在电子围栏'); |
| | | }) |
| | | //新增按钮颜色改回 |
| | | $("#insertEngineeringMap").css("color", "#757575"); |
| | | } else { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('请开始划分电子围栏'); |
| | | }) |
| | | that.polygonFlag = true; |
| | | } |
| | | }) |
| | | |
| | | |
| | | //编辑电子围栏 |
| | | $('.mapBtn .editBtn').click(function() { |
| | | if (!that.isEngineer) { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('请先新增电子围栏信息!') |
| | | }) |
| | | return; |
| | | } |
| | | $("#editEngineeringMap").css("color", "#3385FF"); |
| | | //修改为可编辑状态 |
| | | that.isEdit = true; |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('点击电子围栏图形即可编辑'); |
| | | }) |
| | | }) |
| | | |
| | | }, |
| | |
| | | |
| | | //鼠标右击事件 |
| | | document.getElementById('mainMapWidget').onmousedown = function(event) { |
| | | //去除系统默认右键功能 |
| | | event.preventDefault(); |
| | | if (event.button == 2) { |
| | | if (that.polygonData.length < 2) { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('不能形成区域,请继续划分!!!') |
| | | }) |
| | | return; |
| | | } |
| | | if (that.polygonFlag == true) { |
| | | // 勾画最后一个点 |
| | | var normalizedVal = webMercatorUtils.xyToLngLat(event.mapPoint.x, event.mapPoint.y); |
| | |
| | | success: function(result) { |
| | | if (result.code == 200) { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('新增电子围栏成功!') |
| | | }) |
| | | layui.layer.msg('新增电子围栏成功!') |
| | | }) |
| | | //清除点信息 |
| | | that.polygonData = []; |
| | | //新增按钮颜色改回 |
| | | $("#insertEngineeringMap").css("color", "#757575"); |
| | | } |
| | | } |
| | | }) |
| | |
| | | |
| | | that.isChecked = true; |
| | | |
| | | self.modifyPolygon(); |
| | | //self.modifyPolygon(); |
| | | |
| | | self.activateToolbar(evt.graphic); |
| | | //进入编辑状态 |
| | | //self.activateToolbar(evt.graphic); |
| | | } else { // 点击不在图形上 |
| | | //修改电子围栏选中状态 |
| | | that.isChecked = false; |
| | | |
| | | self.modifyPolygon() |
| | | } |
| | | |
| | | if (that.isEdit) { |
| | | that.isChecked = true; |
| | | self.modifyPolygon(); |
| | | //进入编辑状态 |
| | | self.activateToolbar(evt.graphic); |
| | | } |
| | | } |
| | | |
| | | } |
| | | |
| | | // 提示信息 |
| | | $(document).off('mousemove').mousemove(function(e) { |
| | | var y = e.clientY + 10; |
| | | var x = e.clientX + 20; |
| | | |
| | | if (e.clientX < 40) { |
| | | var x = 40; |
| | | } |
| | | |
| | | if (e.clientY < 42) { |
| | | y = 42; |
| | | } |
| | | |
| | | if (e.clientY > ($(window).height() - 82)) { |
| | | y = ($(window).height() - 66); |
| | | } |
| | | |
| | | if (e.clientX > ($(window).width() - 184)) { |
| | | x = ($(window).width() - 184); |
| | | } |
| | | |
| | | $(document).off('mousemove').mousemove(function(ev) { |
| | | var oEvent = ev || event; |
| | | //鼠标移动 |
| | | var oDiv1 = document.getElementById('securityMapTips1'); |
| | | var oDiv2 = document.getElementById('securityMapTips2'); |
| | | var oDiv3 = document.getElementById('securityMapTips3'); |
| | | var oDiv4 = document.getElementById('securityMapTips4'); |
| | | //新增电子围栏提示语 |
| | | if (self.polygonFlag == true) { |
| | | $('.securityMapTips').stop().show(); |
| | | |
| | | var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; |
| | | var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft; |
| | | if (self.polygonData.length == 0) { |
| | | $('.securityMapTips').text('单击左键开始绘制。'); |
| | | } else { |
| | | if (e.clientY > ($(window).height() - 98)) { |
| | | y = ($(window).height() - 88); |
| | | } |
| | | $('.securityMapTips').text('单击左键新增加点。单击右键完成绘制。'); |
| | | oDiv1.style.left = oEvent.clientX + scrollLeft + 15 + 'px'; |
| | | oDiv1.style.top = oEvent.clientY + scrollTop + 'px'; |
| | | oDiv1.style.display = 'block'; |
| | | } |
| | | |
| | | $('.securityMapTips').css({ |
| | | 'top': y, |
| | | 'left': x, |
| | | }) |
| | | if (self.polygonData.length == 1) { |
| | | oDiv1.style.display = 'none'; |
| | | oDiv2.style.left = oEvent.clientX + scrollLeft + 15 + 'px'; |
| | | oDiv2.style.top = oEvent.clientY + scrollTop + 'px'; |
| | | oDiv2.style.display = 'block'; |
| | | } |
| | | |
| | | if (self.polygonData.length > 1) { |
| | | oDiv2.style.display = 'none'; |
| | | oDiv3.style.left = oEvent.clientX + scrollLeft + 15 + 'px'; |
| | | oDiv3.style.top = oEvent.clientY + scrollTop + 'px'; |
| | | oDiv3.style.display = 'block'; |
| | | } |
| | | } else { |
| | | $('.securityMapTips').stop().hide(); |
| | | oDiv3.style.display = 'none'; |
| | | } |
| | | |
| | | //编辑电子围栏提示语 |
| | | if (that.editToolbarStatus) { |
| | | $("#securityMapTips4").css("width", "200px"); |
| | | $("#securityMapTips4").css("height", "36"); |
| | | var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; |
| | | var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft; |
| | | oDiv4.style.left = oEvent.clientX + scrollLeft + 15 + 'px'; |
| | | oDiv4.style.top = oEvent.clientY + scrollTop + 'px'; |
| | | oDiv4.style.display = 'block'; |
| | | } else { |
| | | oDiv4.style.display = 'none'; |
| | | } |
| | | |
| | | }) |
| | | }, |
| | | |
| | |
| | | routeInfo: dataStr |
| | | }, |
| | | success: function(result) { |
| | | if (result.code == 200) {} |
| | | if (result.code == 200) { |
| | | layui.use('layer', function() { |
| | | layui.layer.msg('电子围栏修改成功!'); |
| | | }) |
| | | $("#editEngineeringMap").css("color", "#757575"); |
| | | $("#securityMapTips4").css("display", "none"); |
| | | self.isEdit = false; |
| | | self.editToolbarStatus = false; |
| | | } |
| | | } |
| | | }) |
| | | |
| | | } |
| | | }, |
| | | |
| | | |
| | | activateToolbar: function(graphic) { |
| | | var that = this; |
| | | |
| | | that.editToolbarStatus = true; |
| | | var tool = 0; |
| | | |
| | | this.editToolbar = new Edit(this._map); |
| | | |
| | | |
| | | // if (registry.byId("tool_move").checked) { |
| | | tool = tool | Edit.MOVE; |
| | |
| | | |
| | | //在地图上新增点 |
| | | addPoint: function(entitys, lgtd, lttd, img) { |
| | | var symbol = new esri.symbol.PictureMarkerSymbol(img, 22, 22); |
| | | if (img == undefined) { |
| | | var symbol = new esri.symbol.PictureMarkerSymbol('./images/point.png', 22, 22); |
| | | } else { |
| | | var symbol = new esri.symbol.PictureMarkerSymbol(img, 22, 22); |
| | | } |
| | | var pt = new Point(lgtd, lttd, new SpatialReference({ |
| | | wkid: 4326 |
| | | })); |
| | |
| | | entitys.add(graphic); |
| | | }, |
| | | |
| | | |
| | | //绘制多边形 |
| | | addPolygon: function(entitys, rings) { |
| | | entitys.clear(); |