From 8f3062cd6729850839b02b4dc0a4a76c4322f1c4 Mon Sep 17 00:00:00 2001
From: Administrator <admin>
Date: Fri, 23 Apr 2021 17:32:41 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/jfpt-Vue
---
public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js | 302 ++++++++++++++++++++++++++++----------------------
1 files changed, 170 insertions(+), 132 deletions(-)
diff --git a/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js b/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
index f95b136..b231345 100644
--- a/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
+++ b/public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
@@ -230,7 +230,7 @@
// return value;
// }
// );
-
+
var as = evt.graphic.attributes;
for (let key in as) {
if (typeof as[key] == 'object') {
@@ -251,7 +251,7 @@
// console.log(cache);
cache = null;
- var fCard = (posi, setdata) => { // 弹窗函数
+ var fCard = (posi, setdata, winSize) => { // 弹窗函数
var that = this,
url = './popup/html/FlareClusterLayer_v3.html',
clickD = null,
@@ -266,103 +266,134 @@
});
that.layuiLayer.close(that.layuiLayer.index);
// layer.alert('layer 新皮肤');
- that.layuiLayer.open({
- title: '',
- type: 2,
- shadeClose: false,
- shade: false,
- skin: 'demo-class',
- // id: 'onelyOne',
- maxmin: false, //开启最大化最小化按钮
- area: ['200px', '75px'],
- // area: 'auto',
- offset: posi,
- skin: 'flare',
- closeBtn: 0, //关闭按钮，可通过配置1和2来展示,0关闭
- content: [url, 'no'],
- resize: false,
- scrollbar: false,
- // tipsMore: true, //允许多个tipe
- // content: num,
- 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;
+ // that.layuiLayer.open({
+ // title: '',
+ // type: 2,
+ // shadeClose: false,
+ // shade: false,
+ // skin: 'demo-class',
+ // // id: 'onelyOne',
+ // maxmin: false, //开启最大化最小化按钮
+ // area: ['200px', '75px'],
+ // // area: 'auto',
+ // offset: posi,
+ // skin: 'flare',
+ // closeBtn: 0, //关闭按钮，可通过配置1和2来展示,0关闭
+ // content: [url, 'no'],
+ // resize: false,
+ // scrollbar: false,
+ // // tipsMore: true, //允许多个tipe
+ // // content: num,
+ // 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;
- layero[0].style.position = 'absolute';
+ // 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", "");
+ // 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", "");
- //判断鼠标是否在地图上
- // 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);
- parent[0].layer.close(+index + 1);
- // parent[0].layer.closeAll();
- // console.log(111111111111)
- clickD = document.onclick = null;
- }
- }
+ // //判断鼠标是否在地图上
+ // // 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);
+ // parent[0].layer.close(+index + 1);
+ // // parent[0].layer.closeAll();
+ // // console.log(111111111111)
+ // clickD = document.onclick = null;
+ // }
+ // }
- var mouseWheel = that.map.on("mouse-wheel", myMouseWheelHandler);
+ // var mouseWheel = that.map.on("mouse-wheel", myMouseWheelHandler);
- function myMouseWheelHandler(event) {
- // console.log("Mouse wheel value = " + event.value);
- parent[0].layer.close(index);
- parent[0].layer.close(+index + 1);
- mouseWheel.remove();
- }
+ // function myMouseWheelHandler(event) {
+ // // console.log("Mouse wheel value = " + event.value);
+ // parent[0].layer.close(index);
+ // parent[0].layer.close(+index + 1);
+ // mouseWheel.remove();
+ // }
- },
- end: function () { //关闭事件
+ // },
+ // end: function () { //关闭事件
- }
- });
+ // }
+ // });
+ // that.layuiLayer.open({ //第二个iframe
+ // title: '',
+ // type: 2,
+ // shadeClose: true,
+ // shade: false,
+ // skin: 'demo-class',
+ // id: 'onelyTwo',
+ // maxmin: false, //开启最大化最小化按钮
+ // area: ['360px', '484px'],
+ // // area: 'auto',
+ // offset: 'r',
+ // skin: 'flare',
+ // isOutAnim: false,
+ // closeBtn: 0, //关闭按钮，可通过配置1和2来展示,0关闭
+ // content: ['./popup/html/FlareClusterLayer_v3 copy.html'],
+ // resize: false,
+ // scrollbar: false,
+ // // tipsMore: true, //允许多个tipe
+ // // content: num,
+ // success: function (layero, index) { //成功后添加全局点击关闭
+ // // var z = document.onclick = ()=>{
+ // // parent[0].layer.close(index);
+ // // // // parent[0].layer.close(+index + 1);
+ // // z = null;
+ // // }
+ // //尝试传值
+ // //js对象转json对象
+ // // $("#layui-layer-iframe" + index).contents().find("input").val(JSON.stringify(evt.graphic.attributes));
+ // $("#layui-layer-iframe" + index).contents().find("#sidIput").val(setdata);
+ // },
+ // })
that.layuiLayer.open({ //第二个iframe
title: '',
type: 2,
@@ -373,10 +404,10 @@
maxmin: false, //开启最大化最小化按钮
area: ['360px', '484px'],
// area: 'auto',
- offset: 'r',
+ offset: winSize,
skin: 'flare',
isOutAnim: false,
- closeBtn: 0, //关闭按钮，可通过配置1和2来展示,0关闭
+ closeBtn: 2, //关闭按钮，可通过配置1和2来展示,0关闭
content: ['./popup/html/FlareClusterLayer_v3 copy.html'],
resize: false,
scrollbar: false,
@@ -392,6 +423,7 @@
//js对象转json对象
// $("#layui-layer-iframe" + index).contents().find("input").val(JSON.stringify(evt.graphic.attributes));
$("#layui-layer-iframe" + index).contents().find("#sidIput").val(setdata);
+
},
})
})
@@ -399,15 +431,13 @@
if (mySelf.onceTimeMethod == null) { //防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
var offsetMy = [+evt.screenY - 300 + 'px', +evt.screenX - 172.5 + 'px'];
// console.log(evt.screenY);
- fCard(offsetMy, setdata);
+ var winSize = [+window.innerHeight / 2 - 242 + 'px', +window.innerWidth - 380 + 'px']
+ // console.log(winSize,4454645634536);
+ fCard(offsetMy, setdata, winSize);
mySelf.onceTimeMethod = setTimeout(() => {
mySelf.onceTimeMethod = null;
}, mySelf.onceTime);
- } else {};
-
-
-
-
+ } else { };
} else {
// var taxLotExtent = evt.graphic.geometry.getExtent();
@@ -754,8 +784,9 @@
},
_clusterData: function () {
-
+ //此函数当前仅适用于不使用预聚集数据的情况
//this function currently only applies if not using preclustered data
+ // console.log('改变111111111111111')
if (this.preClustered) {
return;
}
@@ -841,9 +872,10 @@
cl.singles.push(obj);
}
}
-
for (i = 0, len = this.gridClusters.length; i < len; i++) {
if (this.gridClusters[i].clusterCount === 1) {
+// console.log(this.gridClusters)
+
this._createSingle(this.gridClusters[i].singles[0]);
} else if (this.gridClusters[i].clusterCount > 0) {
this._createCluster(this.gridClusters[i]);
@@ -899,15 +931,21 @@
this.singles.push(single);
delete single.graphic;
var symbol;
- if (single.jtype == 1) {
- symbol = new esri.symbol.PictureMarkerSymbol("./images/yj-jingbao.png", 40, 40);
+ // console.log(single.state);
+ if (single.state != '') {
+ symbol = new esri.symbol.PictureMarkerSymbol("./images/by-jingbao.png", 40, 40);
} else {
- if (single.onlineStatus == 1) {
- symbol = new esri.symbol.PictureMarkerSymbol("./images/zx-jingbao.png", 40, 40);
+ if (single.jtype == 1) {
+ symbol = new esri.symbol.PictureMarkerSymbol("./images/yj-jingbao.png", 40, 40);
} else {
- symbol = new esri.symbol.PictureMarkerSymbol("./images/dx-jingbao.png", 40, 40);
+ if (single.onlineStatus == 1) {
+ symbol = new esri.symbol.PictureMarkerSymbol("./images/zx-jingbao.png", 40, 40);
+ } else {
+ symbol = new esri.symbol.PictureMarkerSymbol("./images/dx-jingbao.png", 40, 40);
+ }
}
}
+
var point = new Point(single[this.xPropertyName], single[this.yPropertyName], this.spatialRef);
var attributes = lang.clone(single);
@@ -1001,11 +1039,11 @@
//add a text element for the label to display the count and add to the group
var shapeCenter = this._getShapeCenter(cluster.graphicShape);
var textShape = groupShape.createText({
- x: shapeCenter.x,
- y: shapeCenter.y + (this.textSymbol.font.size / 2 - 2),
- text: cluster.clusterCount,
- align: 'middle'
- })
+ x: shapeCenter.x,
+ y: shapeCenter.y + (this.textSymbol.font.size / 2 - 2),
+ text: cluster.clusterCount,
+ align: 'middle'
+ })
.setFont({
size: this.textSymbol.font.size,
family: this.textSymbol.font.family,
@@ -1129,10 +1167,10 @@
//create a transparent circle that contains the boundary of the flares, this is to make sure the mouse events don't fire moving in between flares
var conCircleRadius = (center.x - (bbox.x - radius - buffer)) + radius; //get the radius of the circle to contain everything
var containerCircle = groupShape.createCircle({
- cx: center.x,
- cy: center.y,
- r: conCircleRadius
- })
+ cx: center.x,
+ cy: center.y,
+ r: conCircleRadius
+ })
//.setStroke({ width: 1, color: "000" })
.setFill(new Color([0, 0, 0, 0]));
containerCircle.rawNode.setAttribute("class", "flare-object cluster-object");
@@ -1433,11 +1471,11 @@
var textShapes = [];
for (var i = 0, len = lines.length; i < len; i++) {
var textShape = tooltipGroup.createText({
- x: xPos,
- y: yPos + (i * 10),
- text: lines[i],
- align: 'middle'
- })
+ x: xPos,
+ y: yPos + (i * 10),
+ text: lines[i],
+ align: 'middle'
+ })
.setFill("#000")
.setFont({
size: 8,
@@ -1451,12 +1489,12 @@
var rectPadding = 2;
var textBox = tooltipGroup.getBoundingBox();
var rectShape = tooltipGroup.createRect({
- x: textBox.x - rectPadding,
- y: textBox.y - rectPadding,
- width: textBox.width + (rectPadding * 2),
- height: textBox.height + (rectPadding * 2),
- r: 0
- })
+ x: textBox.x - rectPadding,
+ y: textBox.y - rectPadding,
+ width: textBox.width + (rectPadding * 2),
+ height: textBox.height + (rectPadding * 2),
+ r: 0
+ })
.setFill(new Color([255, 255, 255, 0.9]))
.setStroke({
color: "#000",
@@ -1592,11 +1630,11 @@
//Have to add the flare text after the flare group animation otherwise Edge just reloads the page and dies for some reason?
if (this.shape.flareText) {
var flareText = this.shape.createText({
- x: this.shape.flareText.location.x,
- y: this.shape.flareText.location.y,
- text: this.shape.flareText.text,
- align: 'middle'
- })
+ x: this.shape.flareText.location.x,
+ y: this.shape.flareText.location.y,
+ text: this.shape.flareText.text,
+ align: 'middle'
+ })
.setFill(layer.textSymbol.color)
.setFont({
size: this.shape.flareText.textSize,
--
Gitblit v1.9.3