地图弹窗，面包屑样式，地图图标切换

liuyg

2021-04-27 72f62e60dd11c17d3cb3f30962b3fd3a685d01cd

 public/map/widgets/supervisoryMap/SupervisoryMap.js

@@ -205,7 +205,7 @@
        dataType: 'JSON',
        success: function (res) {
          var datas = res.data;
          console.log(datas)
          // console.log(datas)
          var heatmapRenderer = null;
          that.entityData = [];
          for (var i = 0; i < datas.length; i++) {
@@ -216,8 +216,8 @@
              lttd: Number(datas[i].wd)
            })
          }
          // that.flareClusterLayer(datas);
          console.log(datas)
          that.flareClusterLayer(datas);
          // console.log(datas)
          that.heatmapfeatureLayer = that.heatmFeaLayers();
          that._map.addLayer(that.heatmapfeatureLayer);
          // that.checkBoxSelect();//左侧控制热力图重复
@@ -234,9 +234,9 @@
        $('.analysis-and-judgment-tab li:eq(0)').addClass('on').siblings().removeClass('on');
        $($('.analysis-container > div')[0]).stop().show().siblings().stop().hide();

        that.heatmapfeatureLayer_1 = that.heatmFeaLayers();
        that.heatmapfeatureLayer = that.heatmFeaLayers();

        that._map.addLayer(that.heatmapfeatureLayer_1);
        that._map.addLayer(that.heatmapfeatureLayer);
        $('#analysis_select_time_start').val(time.tomorrow);
        $('#analysis_select_time_end').val(time.current);

@@ -269,7 +269,7 @@
      objThis._map.addLayer(objThis._siteLayer);
      var that = this;
      // console.log(mySelf.clusterLayer)
      that.getEquipmentTable($('.analysis-container-equipment').find('.tbody tbody'), '','once');
      that.getEquipmentTable($('.analysis-container-equipment').find('.tbody tbody'), '', 'once');
      // 顶部tab得切换事件
      $('.analysis-and-judgment-tab li').click(function () {
        // if (that.tabIndex == $(this).index()) return;
@@ -281,9 +281,9 @@
          that.entitysData = [];
        }

        if (that.heatmapfeatureLayer_1.graphics.length > 0) {
          that.heatmapfeatureLayer_1.clear();
          that.heatmapfeatureLayer_1.setRenderer();
        if (that.heatmapfeatureLayer.graphics.length > 0) {
          that.heatmapfeatureLayer.clear();
          that.heatmapfeatureLayer.setRenderer();
          $('.analysis-category input').prop('checked', false);
        }

@@ -468,10 +468,19 @@



        console.log(b, id);
        // console.log(b, id);
        var winSize = [+window.innerHeight / 2 - 242 + 'px', +window.innerWidth - 380 + 'px'];
        var as = b;
        var setdata = JSON.stringify(as);
        var bs = {};
        for (let key in as) {
          if (typeof as[key] != 'object') {
            bs[key] = as[key]
            // as = as[key].attributes;
            // console.log('youduixang ')
            // break;
          }
        }
        var setdata = JSON.stringify(bs);
        // console.log(setdata,'setdata')
        var intOpen = () => {
          layui.use('layer', function () {
@@ -513,62 +522,7 @@
          }, mySelf.onceTime);
        } else {
        };
        // var url = './popup/html/owner-details.html?id=' + id;
        // layui.use('layer', function () {
        //   that.layuiLayer = layui.layer;
        //   that.layuiLayer.config({
        //     extend: 'myskin/owner-details.css'
        //   });
        //   that.layuiLayer.close(that.layuiLayer.index);
        //   that.layuiLayer.open({
        //     title: '业主详情',
        //     type: 2,
        //     shadeClose: true,
        //     shade: false,
        //     maxmin: false, //开启最大化最小化按钮
        //     area: ['500px', '340px'],
        //     offset: 'auto',
        //     skin: 'owner-details',
        //     content: url,
        //     closeBtn: 1,
        //   });
        // })


        // var y = +window.innerHeight / 2 + 200;
        // var x = (+window.innerWidth - 360) / 2 + 360 + 70;
        // // document.elementFromPoint(x, y).click();
        // // console.log(x, y)

        // // var a = document.elementFromPoint(21, 122);
        // // console.log(a);

        // // console.log(that.clusterLayer, that._map, 6)
        // // console.log(id, 'id');
        // // console.log(that.clusterLayer);
        // var Tattributes = null
        //   , ds = that.clusterLayer.allData;
        // for (var key in ds) {
        //   if (ds[key].id == id) {
        //     Tattributes = ds[key];
        //   }
        // }
        // if (mySelf.onceTimeMethod == null) {//防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
        //   var evtdata = {};
        //   evtdata = {
        //     graphic: {
        //       attributes: Tattributes,
        //     },
        //     screenX: x,
        //     screenY: y,
        //   }
        //   // console.log(that.clusterLayer,5555555555555);
        //   that.clusterLayer._clickOpenOnclick(evtdata, '控制端', that.clusterLayer.indexs);
        //   mySelf.onceTimeMethod = setTimeout(() => {
        //     mySelf.onceTimeMethod = null;
        //   }, mySelf.onceTime);
        // } else {
        // };
      })
      $('.analysis-container-owner .analysis-table-content .tbody').off('click', '.location').on('click', '.location', function (event) {
        event.stopPropagation();
@@ -584,29 +538,6 @@
      // 设备列表中的点击事件
      $('.analysis-container-equipment .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function (event) {
        var id = $(this).attr('term-listid');
        // console.log(mySelf.Sdata);
        //   // var url = './popup/html/equipment-details.html?obj=' + id;//设备每一项钟打开警情窗口
        //   // layui.use('layer', function () {
        //   //   that.layuiLayer = layui.layer;
        //   //   that.layuiLayer.config({
        //   //     extend: 'myskin/equipment-details.css'
        //   //   });
        //   //   that.layuiLayer.close(that.layuiLayer.index);
        //   //   that.layuiLayer.open({
        //   //     title: '警情详情',
        //   //     type: 2,
        //   //     shadeClose: true,
        //   //     shade: false,
        //   //     maxmin: false, //开启最大化最小化按钮
        //   //     area: ['520px', '320px'],
        //   //     offset: 'auto',
        //   //     skin: 'equipment-details',
        //   //     content: url,
        //   //     closeBtn: 1,
        //   //   });
        //   // })




        event.stopPropagation();
@@ -852,7 +783,7 @@
          var oldData = data.data.records
          var result = oldData;
          that.Pdata = oldData;
          console.log(that.Pdata);//警情筛选
          // console.log(that.Pdata);//警情筛选
          var str = '';
          that.entitysData = [];
          that.analysisAddEntitys.clear();
@@ -861,6 +792,7 @@
            if (result[i].waringType == "紧急求救") {
              result[i].waringType = "一键求助"
            }


            that.createEntitysAnalysis(that.analysisAddEntitys, that.entitysData, '警情信息', {
              lgtd: result[i].jd,
@@ -875,6 +807,7 @@
            h = result[i].alarmTime.substr(11, 5);
            a = Number(i) + 1;


            str += '<tr term-list=' + result[i].id + '>';
            str += '<td>' + a + '</td>';
            str += '<td title=' + result[i].waringType + '>' + result[i].waringType + '</td>';
@@ -882,13 +815,13 @@
            str += "<td><a href='javascript:;' title=" + time + ">" + y + ' ' + h + "</a></td>";
            // str += "<td class='location' style='display: none'> <input type='button' value='定位'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
            if (result[i].jtype == 0) {
              str += "<td class='location'> <input style='color:#000000;background-color:#ffffff;background-image:linear-gradient(to right, #fffff , #fffff' type='button' value='未处理'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
              str += "<td class='location'> <input style='color:#fff;background-color:#F35B5B;width: 50px' type='button' value='未处理'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
            } else {
              if (result[i].jtype == 1) {
                str += "<td class='location'> <input style='color:#000000;background-color:#ffffff;background-image:linear-gradient(to right, #fffff , #fffff' type='button' value='处理中'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
                str += "<td class='location'> <input style='color:#fff;background-color:rgb(18, 145, 230);width: 50px' type='button' value='处理中'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";

              } else {
                str += "<td class='location'> <input style='color:#000000;background-color:#ffffff;background-image:linear-gradient(to right, #fffff , #fffff' type='button' value='已处理'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
                str += "<td class='location'> <input style='color:#fff;background-color:#32C1A2;width: 50px' type='button' value='已处理'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";

              }
            }
@@ -899,6 +832,25 @@


          }

          that.clearLayer();//图标清除
          that.entityData = [];
          for (var i = 0; i < result.length; i++) {
            result[i].x = Number(result[i].jd);
            result[i].y = Number(result[i].wd);
            that.entityData.push({
              lgtd: Number(result[i].jd),
              lttd: Number(result[i].wd)
            })
          }
          // console.log(result);//警情
          if (that.heatmapfeatureLayer.graphics.length > 0) {//热力图数据映射
            that.heatmapfeatureLayer.clear();
            that.heatmapfeatureLayer.setRenderer();
            $('.analysis-category input').prop('checked', false);
          };
          that.flareClusterLayer(result);//图标渲染
          that.clusterLayer._setUserState('警情');//切换聚合图标点击事件

          for (var i = 0; i < 1000; i++) {
            var dd = Math.random();
@@ -955,6 +907,26 @@
          // console.log(oldData)
          var result = oldData;
          that.Ydata = oldData;
          that.clearLayer();//图标清除
          that.entityData = [];
          for (var i = 0; i < result.length; i++) {
            result[i].x = Number(result[i].jd);
            result[i].y = Number(result[i].wd);
            that.entityData.push({
              lgtd: Number(result[i].jd),
              lttd: Number(result[i].wd)
            })
          }
          // console.log(result);//业主
          if (that.heatmapfeatureLayer.graphics.length > 0) {//热力图数据映射
            that.heatmapfeatureLayer.clear();
            that.heatmapfeatureLayer.setRenderer();
            $('.analysis-category input').prop('checked', false);
          };
          that.flareClusterLayer(result);//图标渲染
          that.clusterLayer._setUserState('业主');//切换聚合图标点击事件


          var str = '';
          that.entitysData = [];
          that.analysisAddEntitys.clear();
@@ -976,7 +948,7 @@
              lttd: result[i].wd,
              id: result[i].id
            }, result[i].jd, result[i].wd, './images/owner.png');
            

            a = Number(i) + 1;
            if (result[i].type === "0") {
              createD(result[i].id, a, result[i].tenant_name, result[i].dj, '医院')
@@ -991,12 +963,12 @@
          }


          console.log(that.Ydata);//业主筛选
          // console.log(that.Ydata);//业主筛选
        }
      })
    },
    // 获取设备信息列表
    getEquipmentTable: function (dom, deviceType,once) {
    getEquipmentTable: function (dom, deviceType, once) {
      dom.empty();
      var that = this;
      // console.log(that.clusterLayer)
@@ -1020,7 +992,7 @@
          var oldData = data.data;
          var result = [];
          that.Sdata = oldData;
          

          var str = '';
          that.entitysData = [];
          that.analysisAddEntitys.clear();
@@ -1057,7 +1029,10 @@
              }
            }
          }
          if(once != 'once'){

          if (once != 'once') {
            that.clearLayer();//图标清除
            that.entityData = [];
            for (var i = 0; i < result.length; i++) {
              result[i].x = Number(result[i].jd);
              result[i].y = Number(result[i].wd);
@@ -1066,8 +1041,15 @@
                lttd: Number(result[i].wd)
              })
            }
            console.log(result);//设备筛选
          that.flareClusterLayer(result);
            // console.log(result);//设备筛选
            if (that.heatmapfeatureLayer.graphics.length > 0) {//热力图数据映射
              that.heatmapfeatureLayer.clear();
              that.heatmapfeatureLayer.setRenderer();
              $('.analysis-category input').prop('checked', false);
            };
            that.flareClusterLayer(result);//图标渲染
            that.clusterLayer._setUserState('设备');//切换聚合图标点击事件

          }

          for (var a, i = 0; i < result.length; i++) {
@@ -1264,7 +1246,7 @@


    //聚合图层事件
    flareClusterLayer: function (datas) {  //top聚合事件，导航
    flareClusterLayer: function (datas, userState) {  //top聚合事件，导航

      var that = this;