From 8d837b97ffb27e4e26f067c1febde353bfdf91cf Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 23 Apr 2021 09:16:27 +0800
Subject: [PATCH] Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/jfpt-Vue
---
public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js | 254 ++++++++++++++++++++++++++++++++------------------
1 files changed, 160 insertions(+), 94 deletions(-)
diff --git a/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js b/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
index f355403..f95b136 100644
--- a/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
+++ b/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
@@ -188,11 +188,19 @@
},
// zoomNum: this.map.getZoom(),
indexs: null,
- onceTime: 300, //防抖定时
- onceTimeMethod: null, //防抖判断属性
- onClick: function (evt) { //标志以及聚合表示点击事件
+ onceTime: 300,//防抖定时
+ onceTimeMethod: null,//防抖判断属性
+ onClick: function (evt, und, indexControl) { //标志以及聚合表示点击事件// 弹窗
var eour = evt.graphic.attributes.clusterCount;
var mySelf = this;
+ // console.log(und)
+ if (und == '控制端') {//控制端弹窗关闭
+ parent[0].layer.close(indexControl);
+ parent[0].layer.close(+indexControl + 1);
+ // console.log('控制:', indexControl)
+ }
+ // console.log('tucen:', mySelf.indexs)
+
if (eour == undefined) {
var dataO = evt;
var aa = evt.graphic.screenX;
@@ -204,8 +212,46 @@
}
// console.log(dataO);
// console.log(aa - bb);
+ var cache = [];
+ //解决重复JSON.stringify将循环结构转换为JSON。有几率出错，err：TypeError: Converting circular structure to JSON
- var fCard = (posi, ind, olds) => {
+
+ // var setdata = JSON.stringify(evt.graphic.attributes
+
+ // , function (key, value) {
+ // if (typeof value === 'object' && value !== null) {
+ // if (cache.indexOf(value) !== -1) {
+ // // 移除
+ // return;
+ // }
+ // // 收集所有的值
+ // cache.push(value);
+ // }
+ // return value;
+ // }
+ // );
+
+ var as = evt.graphic.attributes;
+ for (let key in as) {
+ if (typeof as[key] == 'object') {
+ as = as[key].attributes;
+ // console.log('youduixang ')
+ break;
+ }
+ }
+ var setdata = JSON.stringify(as);
+ // console.log(setdata);
+ // var newkeys = Object.keys(evt.graphic.attributes);
+ // var newvalues = Object.values(evt.graphic.attributes);
+ // var str = "";
+ // newkeys.forEach(function (item,index) {
+ // str += item
+ // })
+
+
+ // console.log(cache);
+ cache = null;
+ var fCard = (posi, setdata) => { // 弹窗函数
var that = this,
url = './popup/html/FlareClusterLayer_v3.html',
clickD = null,
@@ -238,59 +284,61 @@
scrollbar: false,
// tipsMore: true, //允许多个tipe
// content: num,
- success: function (layero, index) { //成功后添加全局点击关闭
- $("#layui-layer-iframe" + index).contents().find("#input1").val(JSON.stringify(evt.graphic.attributes));
+ success: function (layero, index) {//成功后添加全局点击关闭
+ // console.log(evt.graphic.attributes);
+ $("#layui-layer-iframe" + index).contents().find("#input1").val(setdata);
// console.log(layero, index);
that.indexs = index;
-
- var isclickD = true,
- endx = null,
- endy = null;
+ var isclickD = true
+ , endx = null
+ , endy = null;
layero[0].style.position = 'absolute';
downs = document.onmousedown = () => { //鼠标按下事件
// console.log('down');//start
// downs = document.onmousedown = null;
- var mx = window.event.clientX //鼠标初始位置
- ,
- my = window.event.clientY,
- cx = this.offset[1].replace("px", "") //初始位置
- ,
- cy = this.offset[0].replace("px", "");
- if (endx != null && endy != null) {
- cx = endx;
- cy = endy;
- }
- moves = document.onmousemove = () => { //鼠标移动事件
- // console.log('move');//move
- // console.log(this.offset)
- var ux = window.event.clientX //记录实时位置
- ,
- uy = window.event.clientY;
- endx = +cx + (ux - mx) // 初始位置+（鼠标初始位置-实时位置）
- endy = +cy + (uy - my);
- layero[0].style.left = endx + 'px';
- layero[0].style.top = endy + 'px';
- // console.log(+cx, +cy,'初始位置');
- // console.log(mx, my,'鼠标初始位置');
- // console.log(ux, uy,'记录实时位置');
- // console.log(ux, uy,'最后位置');
- isclickD = false;
- ups = document.onmouseup = () => { //鼠标抬起事件
- // console.log('up');//end
- // downs = document.onmousedown = null;
- moves = document.onmousemove = null;
- ups = document.onmouseup = null;
- var timess = setTimeout(() => {
- clearTimeout(timess);
- timess = null;
- isclickD = true;
- }, 1);
+ var mx = window.event.clientX//鼠标初始位置
+ , my = window.event.clientY
+ , cx = this.offset[1].replace("px", "")//初始位置
+ , cy = this.offset[0].replace("px", "");
+
+ //判断鼠标是否在地图上
+ // console.log(mx,'+',my);
+ if (mx > 359 && mx < 1543 && my > 5 && my < 818) {
+ // console.log('on map')
+ if (endx != null && endy != null) {
+ cx = endx;
+ cy = endy;
+ }
+ moves = document.onmousemove = () => {//鼠标移动事件
+ // console.log('move');//move
+ // console.log(this.offset)
+ var ux = window.event.clientX//记录实时位置
+ , uy = window.event.clientY;
+ endx = +cx + (ux - mx)// 初始位置+（鼠标初始位置-实时位置）
+ endy = +cy + (uy - my);
+ layero[0].style.left = endx + 'px';
+ layero[0].style.top = endy + 'px';
+ // console.log(+cx, +cy,'初始位置');
+ // console.log(mx, my,'鼠标初始位置');
+ // console.log(ux, uy,'记录实时位置');
+ // console.log(ux, uy,'最后位置');
+ isclickD = false;
+ ups = document.onmouseup = () => {//鼠标抬起事件
+ // console.log('up');//end
+ // downs = document.onmousedown = null;
+ moves = document.onmousemove = null;
+ ups = document.onmouseup = null;
+ var timess = setTimeout(() => {
+ clearTimeout(timess);
+ timess = null;
+ isclickD = true;
+ }, 1);
+ }
}
}
}
-
clickD = document.onclick = () => {
if (isclickD) {
parent[0].layer.close(index);
@@ -342,14 +390,16 @@
// }
//尝试传值
//js对象转json对象
- $("#layui-layer-iframe" + index).contents().find("input").val(JSON.stringify(evt.graphic.attributes));
+ // $("#layui-layer-iframe" + index).contents().find("input").val(JSON.stringify(evt.graphic.attributes));
+ $("#layui-layer-iframe" + index).contents().find("#sidIput").val(setdata);
},
})
})
}
if (mySelf.onceTimeMethod == null) { //防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
var offsetMy = [+evt.screenY - 300 + 'px', +evt.screenX - 172.5 + 'px'];
- fCard(offsetMy);
+ // console.log(evt.screenY);
+ fCard(offsetMy, setdata);
mySelf.onceTimeMethod = setTimeout(() => {
mySelf.onceTimeMethod = null;
}, mySelf.onceTime);
@@ -362,66 +412,78 @@
} else {
// var taxLotExtent = evt.graphic.geometry.getExtent();
// this.map.setExtent(evt.graphic._extent)
- this.map.setZoom(this.map.getZoom() + 1) //地图中心缩放
+ // this.map.setZoom(this.map.getZoom() + 1)//地图中心缩放
+ // console.log(this.map.getZoom())
// this.map.setZoom(18);
+ // event.stopPropagation();
+ var lgtd = Number(evt.graphic.attributes.x);//地图跟随缩放
+ var lttd = Number(evt.graphic.attributes.y);
+ // // console.log($(this).find('input').attr('lttd'));
+ var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点
+ this._map.centerAndZoom(position, this.map.getZoom() + 1);//缩放，10是缩放级别，可以自定义，数值越大缩放越大
+
parent[0].layer.close(this.indexs)
parent[0].layer.close(+this.indexs + 1)
// console.log('111:', this.map.zoomToFullExtent(), '222:', evt, evt.graphic._extent, 'zoom');
}
// console.log(evt)
- this._restoreInfoWindowSettings();
- if (evt.graphic.attributes.isCluster) {
- evt.stopPropagation();
- //this._activateCluster(evt.graphic);
- this.map.infoWindow.hide();
- } else if (evt.graphic.attributes.isFlare) {
- evt.stopPropagation();
+ if (und != '控制端') {
+ this._restoreInfoWindowSettings();
- var flareObject = this._getFlareFromGraphic(evt.graphic);
- if (!flareObject) {
- this._hideFlareDetail();
+ if (evt.graphic.attributes.isCluster) {
+ evt.stopPropagation();
+ //this._activateCluster(evt.graphic);
this.map.infoWindow.hide();
- return;
- }
+ } else if (evt.graphic.attributes.isFlare) {
+ evt.stopPropagation();
- if (flareObject.isSummaryFlare || !flareObject.singleData) {
- this._showFlareDetail(evt.graphic);
+ var flareObject = this._getFlareFromGraphic(evt.graphic);
+ if (!flareObject) {
+ this._hideFlareDetail();
+ this.map.infoWindow.hide();
+ return;
+ }
+
+ if (flareObject.isSummaryFlare || !flareObject.singleData) {
+ this._showFlareDetail(evt.graphic);
+ this.map.infoWindow.hide();
+ return;
+ }
+
+ //if we're clicking on a single data flare then show an info window
+ var graphic = evt.graphic;
+
+ this.originalInfoWindow = {
+ highlight: lang.clone(this.map.infoWindow.get("highlight")),
+ anchor: lang.clone(this.map.infoWindow.anchor)
+ };
+
this.map.infoWindow.hide();
- return;
+ this.map.infoWindow.clearFeatures();
+ this.map.infoWindow.set("highlight", false);
+ this.map.infoWindow.setFeatures([graphic]);
+
+ //when getting screen point make sure we use the location of the flare on screen, by converting the map point on the object.
+ var sp = this.map.toScreen({
+ x: flareObject.mapPoint.x,
+ y: flareObject.mapPoint.y
+ });
+
+ //Could do something with the anchor of the info window here if wanted. The offsets can be a bit wacky as well.
+ //var anchor = this._getInfoWindowAnchor(flareObject.degree);
+ //this.map.infoWindow.anchor = anchor;
+
+ this.map.infoWindow.cluster = this.activeCluster;
+ //reset the geometry of the flare feature in the info window to be the actual location of the flared object, not the location of the flare graphic.
+ var p = webMercatorUtils.geographicToWebMercator(new Point(flareObject.singleData[this.xPropertyName], flareObject.singleData[this.yPropertyName], this.spatialRef));
+ this.map.infoWindow.features[0].geometry = p;
+ this.map.infoWindow.show(sp);
+
}
-
- //if we're clicking on a single data flare then show an info window
- var graphic = evt.graphic;
-
- this.originalInfoWindow = {
- highlight: lang.clone(this.map.infoWindow.get("highlight")),
- anchor: lang.clone(this.map.infoWindow.anchor)
- };
-
- this.map.infoWindow.hide();
- this.map.infoWindow.clearFeatures();
- this.map.infoWindow.set("highlight", false);
- this.map.infoWindow.setFeatures([graphic]);
-
- //when getting screen point make sure we use the location of the flare on screen, by converting the map point on the object.
- var sp = this.map.toScreen({
- x: flareObject.mapPoint.x,
- y: flareObject.mapPoint.y
- });
-
- //Could do something with the anchor of the info window here if wanted. The offsets can be a bit wacky as well.
- //var anchor = this._getInfoWindowAnchor(flareObject.degree);
- //this.map.infoWindow.anchor = anchor;
-
- this.map.infoWindow.cluster = this.activeCluster;
- //reset the geometry of the flare feature in the info window to be the actual location of the flared object, not the location of the flare graphic.
- var p = webMercatorUtils.geographicToWebMercator(new Point(flareObject.singleData[this.xPropertyName], flareObject.singleData[this.yPropertyName], this.spatialRef));
- this.map.infoWindow.features[0].geometry = p;
- this.map.infoWindow.show(sp);
-
}
+
},
//Add a data point to be clustered.
@@ -1577,6 +1639,10 @@
this.animationsRunning = [];
},
+ _clickOpenOnclick: function (e, und, indexControl) {
+ this.onClick(e, und, indexControl)
+ }
+
//#endregion
});
});
--
Gitblit v1.9.3