南昌市物联网技防平台-前端
zengh
2023-01-16 8aa3edd56c279100c9053576f3e90fa55459fe77
public/map/widgets/supervisoryMap/FlareClusterLayer_v3.js
@@ -73,12 +73,19 @@
      this.maxFlareCount = options.maxFlareCount || 8;
      this.displaySingleFlaresAtCount = options.displaySingleFlaresAtCount || 8;
      this.singleFlareTooltipProperty = options.singleFlareTooltipProperty || null;
      var defaultTextSymbol = new TextSymbol()
      var defaultTextSymbol = new TextSymbol()//聚合字体
        .setColor(new Color([255, 255, 255]))
        .setAlign(Font.ALIGN_START)
        .setFont(new Font("10pt").setWeight(Font.WEIGHT_BOLD).setFamily("calibri"))
        // .setAlign(Font.ALIGN_START)//被否决
        .setOffset(+100, +10)//偏量
        // .setHaloSize(1)
        .setFont(new Font("15pt").setWeight(Font.WEIGHT_BOLD).setFamily("calibri"))
        .setSize("30")
        // .setOffsetY(-30)
        .setHorizontalAlignment("middle")
        .setVerticalAlignment("middle");
      defaultTextSymbol.font.size = 30;
      // defaultTextSymbol.font.size = 30;
      // defaultTextSymbol.yoffset = 10;
      // console.log(defaultTextSymbol,2123445453)
      this.textSymbol = options.textSymbol || defaultTextSymbol;
      this.flareShowMode = options.flareShowMode || "mouse";
@@ -198,7 +205,7 @@
      var mySelf = this;
      // console.log(und)
      if (und == '控制端') {//控制端弹窗关闭
        parent[0].layer.close(indexControl);
        // parent[0].layer.close(indexControl);
        // parent[0].layer.close(+indexControl + 1);
      }
@@ -251,103 +258,103 @@
              });
              that.layuiLayer.close(that.layuiLayer.index);
              //两个弹窗
              that.layuiLayer.open({
                title: '',
                type: 2,
                shadeClose: false,
                shade: false,
                skin: 'demo-class',
                // id: 'onelyOne',
                maxmin: false, //开启最大化最小化按钮
                area: ['200px', '70px'],
                // area: 'auto',
                offset: posi,
                skin: 'flares',
                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', '70px'],
              //   // area: 'auto',
              //   offset: posi,
              //   skin: 'flares',
              //   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);
                  //鼠标滚轮事件
                  function myMouseWheelHandler(event) {
                    // console.log("Mouse wheel value = " + event.value);
                    parent[0].layer.close(index);
                    // parent[0].layer.close(+index + 1);
                    mouseWheel.remove();
                  }
              //     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();
              //     }
                },
                end: function () { //关闭事件
              //   },
              //   end: function () { //关闭事件
                }
              });
              //   }
              // });
              that.layuiLayer.open({ //第二个iframe
                title: '',
                type: 2,
@@ -519,7 +526,7 @@
        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)
        // parent[0].layer.close(+this.indexs + 1)
        // console.log('111:', this.map.zoomToFullExtent(), '222:', evt, evt.graphic._extent, 'zoom');
@@ -729,6 +736,7 @@
    _graphicDraw: function (e) {
      var g = e.graphic;
      if (g.attributes.isCluster) {
        //create the cluster graphics if this is a cluster being drawn
        var cl = this._getClusterFromGraphic(g);
@@ -766,7 +774,8 @@
      }
    },
    _graphicMouseOut: function (e) {
    _graphicMouseOut: function (e) {//鼠标进入图片事件
      if (e.graphic.attributes.isFlare) {
        this._hideFlareDetail();
      }
@@ -852,6 +861,7 @@
      //此函数当前仅适用于不使用预聚集数据的情况
      //this function currently only applies if not using preclustered data
      // console.log('改变111111111111111')
      if (this.preClustered) {
        return;
      }
@@ -946,7 +956,6 @@
          this._createCluster(this.gridClusters[i]);
        }
      }
    },
    _createClusterGrid: function (webExtent) {
@@ -992,24 +1001,37 @@
      }
    },
    _createSingle: function (single) {
    _createSingle: function (single) {//加载图标样式
      this.singles.push(single);
      delete single.graphic;
      var symbol;
      // console.log(single.state);
      if (single.state != '') {
        symbol = new esri.symbol.PictureMarkerSymbol("./images/by-jingbao.png", 40, 40);
      } else {
        if (single.jtype == 1) {
          symbol = new esri.symbol.PictureMarkerSymbol("./images/yj-jingbao.png", 40, 40);
        } else {
          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);
          }
      if (single.tenant_id == undefined) {//如果不是业主
        if (single.dtype == 3) {
          symbol = new esri.symbol.PictureMarkerSymbol("./images/by-jingbao.png", 40, 40);
        } else if (single.dtype == 2) {
          symbol = new esri.symbol.PictureMarkerSymbol("./images/selfbaojin2.gif", 80, 80);
        } else if (single.dtype == 1) {
          symbol = new esri.symbol.PictureMarkerSymbol("./images/zx-jingbao.png", 40, 40);
        } else if (single.dtype == 0) {
          symbol = new esri.symbol.PictureMarkerSymbol("./images/dx-jingbao.png", 40, 40);
        }
        // if (single.state != '') {
        //   symbol = new esri.symbol.PictureMarkerSymbol("./images/by-jingbao.png", 40, 40);
        // } else {
        //   if (single.jtype == 1) {
        //     symbol = new esri.symbol.PictureMarkerSymbol("./images/selfbaojin2.gif", 80, 80);
        //   } else {
        //     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);
        //     }
        //   }
        // }
      } else {//是业主
        symbol = new esri.symbol.PictureMarkerSymbol("./images/Yz.png", 40, 40);
      }
      var point = new Point(single[this.xPropertyName], single[this.yPropertyName], this.spatialRef);
@@ -1105,7 +1127,7 @@
      var shapeCenter = this._getShapeCenter(cluster.graphicShape);
      var textShape = groupShape.createText({
        x: shapeCenter.x,
        y: shapeCenter.y + (this.textSymbol.font.size / 2 - 2),
        y: shapeCenter.y + (this.textSymbol.font.size / 2 - 6),//聚合文字设置
        text: cluster.clusterCount,
        align: 'middle'
      })
@@ -1233,7 +1255,7 @@
      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,
        cy: +center.y + 3,
        r: conCircleRadius
      })
        //.setStroke({ width: 1, color: "000" })
@@ -1534,7 +1556,7 @@
      tooltipGroup.rawNode.setAttribute("class", "tooltip-text");
      var textShapes = [];
      for (var i = 0, len = lines.length; i < len; i++) {
      for (var i = 0, len = lines.length; i < len; i++) {//聚合字体
        var textShape = tooltipGroup.createText({
          x: xPos,
          y: yPos + (i * 10),
@@ -1543,7 +1565,7 @@
        })
          .setFill("#000")
          .setFont({
            size: 8,
            size: 8,//聚合字体大小//没效果
            family: this.textSymbol.font.family,
            weight: this.textSymbol.font.weight
          });