{"remainingRequest":"D:\\jenkins\\workspace\\yhxt-web\\node_modules\\thread-loader\\dist\\cjs.js!D:\\jenkins\\workspace\\yhxt-web\\node_modules\\babel-loader\\lib\\index.js!D:\\jenkins\\workspace\\yhxt-web\\node_modules\\eslint-loader\\index.js??ref--13-0!D:\\jenkins\\workspace\\yhxt-web\\src\\views\\bigScreen\\mixin\\mapMixin.js","dependencies":[{"path":"D:\\jenkins\\workspace\\yhxt-web\\src\\views\\bigScreen\\mixin\\mapMixin.js","mtime":1736792007303},{"path":"D:\\jenkins\\workspace\\yhxt-web\\babel.config.js","mtime":1667326389982},{"path":"D:\\jenkins\\workspace\\yhxt-web\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\yhxt-web\\node_modules\\thread-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\yhxt-web\\node_modules\\babel-loader\\lib\\index.js","mtime":456789000000},{"path":"D:\\jenkins\\workspace\\yhxt-web\\node_modules\\eslint-loader\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/es7.object.get-own-property-descriptors\";\nimport \"core-js/modules/es6.object.keys\";\nimport _defineProperty from \"D:/jenkins/workspace/yhxt-web/node_modules/@babel/runtime/helpers/esm/defineProperty.js\";\nimport \"core-js/modules/es6.string.iterator\";\nimport \"core-js/modules/es6.set\";\nimport _toConsumableArray from \"D:/jenkins/workspace/yhxt-web/node_modules/@babel/runtime/helpers/esm/toConsumableArray.js\";\nimport \"core-js/modules/web.dom.iterable\";\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\nimport Vue from 'vue';\nimport InfoWindowVue from '@/views/bigScreen/components/InfoWindow.vue'; // 引入地图信息窗体\nimport markerbg from '@/views/bigScreen/img/roadtitbg.png';\nexport var mapMixin = {\n  data: function data() {\n    return {\n      map: null,\n      bridgeCoordinateList: [],\n      // 地图显示的桥梁坐标信息\n      bridgeParams: {\n        pageBean: {\n          pageSize: -1\n        }\n      },\n      massMarks: null,\n      // 桥梁标记点\n      markers: [],\n      boundaryLineFace: [{\n        // 地图省份边界  layerIdl边界线 layerIdf 边界面\n        code: 'SC',\n        layerIdl: '20187ac7367e14034b8c19a40a33fe30',\n        layerIdf: '4394876460f6c3bd34d0615bf04cff47'\n      }, {\n        code: 'AH',\n        layerIdl: 'ef01a0169aaec81e77e9f0048ceb9713',\n        layerIdf: '3dde510c446230cbd4fdd15c5fb85416'\n      }, {\n        code: 'YN',\n        layerIdl: '06fc0230dad437e85d24600e06516587',\n        layerIdf: '031e5e61df73778bce2c2d82a4fc0a1c'\n      }, {\n        code: 'GZ',\n        layerIdl: '6c66cdbaddbcf839a529b03bcee23266',\n        layerIdf: 'd960ce4f0fe3eafeebf02a908e25910b'\n      }, {\n        code: 'CQ',\n        layerIdl: 'dfc9779a51de79b2eb40790f613964e2',\n        layerIdf: 'b37573d5d73f223aa5cf4293efeda3c0'\n      }, {\n        code: 'XJ',\n        layerIdl: 'b6f8c73b2d314bd6e091012fd7698e94',\n        layerIdf: '238a5e9de56faa7385873aaadf3ad67d'\n      }, {\n        code: 'HN',\n        layerIdl: '4edbe95e3ec8786276bb39ce7c42453f',\n        layerIdf: 'c1c5c040257326352d694528b7e33fac'\n      }],\n      selectLineLayer: [],\n      //已选择（已展示）的线路的id\n      allRoadSections: [],\n      filterRoadId: [],\n      options: [],\n      selectSingle: false,\n      //地图跳转到指定路段\n      markerDomListID: [],\n      markerList: {},\n      provinceMarker: [{\n        code: 'CQ',\n        zb: [107.569855, 30.367095],\n        id: \"1430734631036129280\",\n        zoom: 6.8 //重庆\n      }, {\n        code: 'SC',\n        zb: [102.928995, 30.52487],\n        id: \"1430710034819584000\",\n        zoom: 5.8 //四川\n      }, {\n        code: 'YN',\n        zb: [101.593103, 25.353375],\n        id: \"1494140182780317696\",\n        zoom: 6.1 //云南\n      }, {\n        code: 'GZ',\n        zb: [106.641243, 27.10797],\n        id: \"1497493237982695424\",\n        zoom: 6.5 //贵州\n      }, {\n        code: 'AH',\n        zb: [117.229929, 32.325398],\n        id: \"AH\",\n        zoom: 6.5 //安徽\n      }]\n    };\n  },\n  mounted: function mounted() {\n    // this.initMap() // 高德地图\n    this.initMineMap(); // MineMap 2D 地图\n  },\n  created: function created() {\n    // 获取路段坐标信息绘制路段\n    // this.getRoadCoordinate()\n    // 获取桥梁坐标信息标记桥梁位置\n    // this.getBridgrCoordinate(this.bridgeParams)\n  },\n  methods: {\n    // 加载mineMap2D地图\n    initMineMap: function initMineMap() {\n      var _this = this;\n      // 全局配置\n      minemap.domainUrl = 'https://map.hope.cmet1965.com:58000'; /* MineMap根域名地址 */\n      /* MineMap矢量数据服务根域名地址 */\n      minemap.dataDomainUrl = 'https://map.hope.cmet1965.com:58000';\n      /* MineMap矢量数据服务新规范根域名地址 */\n      minemap.serverDomainUrl = 'https://map.hope.cmet1965.com:58000';\n      /* MineMap底图雪碧图地址 */\n      minemap.spriteUrl = ['https://map.hope.cmet1965.com:58000/minemapapi/zsxz/zsxz']; // \"./mapresource/sprite/sprite\",\n      /* MineMap后台服务根地址 */\n      minemap.serviceUrl = 'https://map.hope.cmet1965.com:58000/service/';\n      // minemap.spriteUrl = [\n      //     \"https://map.hope.cmet1965.com:58000/minemapapi/zsxz/zsxz\",\n      //     \"./mapresource/sprite/sprite\",\n      // ];\n      // 配置 key、solution\n      minemap.key = '30be7831caf84685b94e78727e4ce25f';\n      minemap.solution = 16932;\n\n      // 初始化地图实例\n      this.map = new minemap.Map({\n        container: 'map',\n        style: 'https://map.hope.cmet1965.com:58000/service/solu/style/id/16932' /* 底图样式 */,\n        center: [107.85585, 28.465908] /*地图中心点*/,\n        zoom: 7 /*地图默认缩放等级*/,\n        pitch: 0 /*地图俯仰角度*/,\n        maxZoom: 17 /*地图最大缩放等级*/,\n        minZoom: 3 /*地图最小缩放等级*/\n      });\n\n      //   this.map.setLayoutProperty('30be7831caf84685b94e78727e4ce25f', \"visibility\", \"none\");\n\n      this.map.on('load', function () {\n        _this.setHinight();\n\n        // this.getRoadsLngLat()\n        // 增加自定义数据源、自定义图层\n        // this.addSources()\n        // this.addLayers()\n        // const layeyId = \"linelayer\" + '1493834264024846336' + 1;\n        // this.map.moveLayer(layeyId, '42fecafad2b371617b5812498e2bba05') //千米桩\n      });\n    },\n    //地图跳转\n    jumpTo: function jumpTo(priveId) {\n      var _this2 = this;\n      this.provinceMarker.forEach(function (item) {\n        if (priveId.length >= 2) {\n          if (item.id == priveId[1]) {\n            if (_this2.map) {\n              _this2.boundaryLineFace.forEach(function (el) {\n                if (item.code == el.code) {\n                  _this2.map.setLayoutProperty(el.layerIdl, 'visibility', 'visible');\n                  _this2.map.setLayoutProperty(el.layerIdf, 'visibility', 'visible');\n                } else {\n                  _this2.map.setLayoutProperty(el.layerIdl, 'visibility', 'none');\n                  _this2.map.setLayoutProperty(el.layerIdf, 'visibility', 'none');\n                }\n              });\n              // this.$emit('onLoad', this.map)\n            }\n\n            _this2.map.flyTo({\n              center: item.zb,\n              zoom: item.zoom\n            });\n          }\n        }\n        if (priveId.length == 1 || priveId.length == 0) {\n          _this2.setHinight();\n          _this2.map.flyTo({\n            center: [107.85585, 28.465908],\n            zoom: 7\n          });\n        }\n      });\n    },\n    //设置部分省份高亮\n    setHinight: function setHinight() {\n      var _this3 = this;\n      if (this.map) {\n        this.boundaryLineFace.forEach(function (el) {\n          _this3.map.setLayoutProperty(el.layerIdl, 'visibility', 'visible');\n          _this3.map.setLayoutProperty(el.layerIdf, 'visibility', 'visible');\n        });\n        this.$emit('onLoad', this.map);\n      }\n    },\n    //全国路段标注\n    getRouteMarke: function getRouteMarke() {\n      var _this4 = this;\n      var params = {\n        groupRelation: \"AND\",\n        groupTree: {},\n        pageBean: {\n          page: 1,\n          pageSize: -1,\n          showTotal: true\n        },\n        params: {},\n        querys: []\n      };\n      this.$http.post('${yhxt}/bizRoadMapPoint/v1/query', params).then(function (res) {\n        _this4.allRoadSections = res.data.rows || [];\n        var Id = [];\n        var test = [];\n        _this4.getLastLevelIds(_this4.options[0]).forEach(function (item) {\n          _this4.allRoadSections.forEach(function (ele) {\n            test.push(ele.sectionId);\n            if (item == ele.sectionId) {\n              Id.push(ele);\n            }\n          });\n        });\n        // console.log('接口获取数组', test);\n\n        // console.log(\"全部数组\", this.getLastLevelIds(this.options[0]));\n\n        // console.log(\"ID\", Id);\n\n        if (Id.length) {\n          Id.forEach(function (item) {\n            _this4.getAddLineLayer(item);\n            _this4.selectLineLayer.push(item.sectionId);\n          });\n          _this4.selectLineLayer = _toConsumableArray(new Set(_this4.selectLineLayer));\n          _this4.filterUniqueSectionIds(Id).forEach(function (item) {\n\n            // this.selectLineLayer.push(item.sectionId)\n            // this.roadMarker(item)\n          });\n        }\n      });\n    },\n    //线路图层\n    getAddLineLayer: function getAddLineLayer(item) {\n      var _this5 = this;\n      if (item && item.linePoints) {\n        var linePoints = \"[\".concat(item.linePoints, \"]\");\n        linePoints = JSON.parse(linePoints);\n        //       linesource/linelayer/symbolLayerId(数据源/线路/线路上的文字) + 路段id + dir（1是上行 2是下行）\n        var sourceId = \"linesource\" + item.sectionId + item.dir;\n        var layeyId = \"linelayer\" + item.sectionId + item.dir;\n        var symbolLayerId = \"linesymbollayer\" + item.sectionId + item.dir;\n        var jsonData = {\n          type: \"FeatureCollection\",\n          features: [{\n            type: \"Feature\",\n            geometry: {\n              type: \"LineString\",\n              coordinates: linePoints\n            },\n            properties: {\n              title: item.sectionName,\n              kind: item.sectionId\n            }\n          }]\n        };\n        !this.map.getSource(sourceId) && this.map.addSource(sourceId, {\n          type: \"geojson\",\n          data: jsonData\n        });\n        var beforeIdtext = \"\";\n        var beforeIdline = \"\";\n        if (this.map.getLayer(\"point-outer-cluster-0\")) {\n          // point-outer-cluster-0 是视频监控的聚合图层\n          beforeIdtext = \"point-outer-cluster-0\";\n          beforeIdline = \"point-outer-cluster-0\";\n        }\n        //  设置addLayer的第二个参数beforeId，表示这个图层显示在beforeId的图层下面\n        // if (item.dir == 2) {\n        //     beforeIdline = `linesymbollayer${item.sectionId}1`;\n        // }\n        // 线路图层\n        !this.map.getLayer(layeyId) && this.map.addLayer({\n          id: layeyId,\n          type: \"line\",\n          source: sourceId,\n          layout: {\n            \"line-join\": \"round\",\n            \"line-cap\": \"round\",\n            \"border-visibility\": \"visible\" //是否开启线边框\n          },\n\n          paint: {\n            \"line-width\": 6,\n            \"line-color\": {\n              type: \"categorical\",\n              property: \"kind\",\n              stops: [[1, \"#7FAFFD\"], [2, \"#7FAFFD\"]],\n              default: \"#7FAFFD\" //4DBCFA\n            },\n\n            \"line-border-width\": 1,\n            //设置线边框宽度\n            \"line-border-opacity\": 0.5,\n            //设置线边框透明度\n            \"line-border-color\": \"#fff\" //设置线边框颜色\n          }\n        }, beforeIdline);\n        //绘制线路图层\n        // this.getAddTrafficLayer(item);\n        //文字（高速路名称）图层\n        !this.map.getLayer(symbolLayerId) && this.map.addLayer({\n          id: symbolLayerId,\n          type: \"symbol\",\n          source: sourceId,\n          layout: {\n            \"text-field\": \"{title}\",\n            \"text-size\": 14,\n            \"symbol-placement\": \"line\"\n          },\n          paint: {\n            \"text-color\": \"#ffffff\",\n            \"text-halo-color\": \"#ffffff\",\n            \"text-halo-width\": 0.3\n          }\n        }, beforeIdtext);\n        if (this.isJump) {\n          var centerNum = Math.ceil(linePoints.length / 2);\n          var centerPoint = linePoints[centerNum];\n          this.provinceMarker.forEach(function (item) {\n            if (item.id == _this5.setHinightId) {\n              _this5.setSingHiNight(item.code);\n            }\n          });\n          // if (setHinightId)\n          // this.provinceMarker.forEach((item) => {\n          //     this.boundaryLineFace.forEach((el) => {\n          //         if (item.id == this.setHinightId && item.code == el.code) {\n          //             console.log('1111111地图显示');\n\n          //             this.map.setLayoutProperty(el.layerIdl, 'visibility', 'visible')\n          //             // debugger\n          //             this.map.setLayoutProperty(el.layerIdf, 'visibility', 'visible')\n          //         }\n          //         else {\n          //             this.map.setLayoutProperty(el.layerIdl, 'visibility', 'none')\n          //             this.map.setLayoutProperty(el.layerIdf, 'visibility', 'none')\n          //         }\n          //     })\n          // })\n          // 跳转至该线路\n          this.map.flyTo({\n            center: centerPoint,\n            zoom: 9\n          });\n        }\n        // const qmz = JSON.parse(localStorage.getItem(\"mapCLkmz\"));\n        // this.map.moveLayer(layeyId, 'b5ebe9f4b52d23fb83170b4936b56429') //千米桩\n        this.map.moveLayer(layeyId, '1c846138267b20d808d1bd5af60e2388'); //千米桩\n        this.map.moveLayer(layeyId, '1947a40c8039e9ade6ac855124b0403d'); //百米桩\n      }\n    },\n    setSingHiNight: function setSingHiNight(code) {\n      var _this6 = this;\n      this.boundaryLineFace.forEach(function (item) {\n        _this6.map.setLayoutProperty(item.layerIdl, 'visibility', 'none');\n        _this6.map.setLayoutProperty(item.layerIdf, 'visibility', 'none');\n      });\n      this.boundaryLineFace.forEach(function (item) {\n        if (item.code == code) {\n          console.log('地图高亮设置', item);\n          _this6.map.setLayoutProperty(item.layerIdl, 'visibility', 'visible');\n          _this6.map.setLayoutProperty(item.layerIdf, 'visibility', 'visible');\n        } else {\n          _this6.map.setLayoutProperty(item.layerIdl, 'visibility', 'none');\n          _this6.map.setLayoutProperty(item.layerIdf, 'visibility', 'none');\n        }\n      });\n    },\n    //id去重\n    filterUniqueSectionIds: function filterUniqueSectionIds(array) {\n      var seenSectionIds = new Set();\n      var result = [];\n      array.forEach(function (item) {\n        if (!seenSectionIds.has(item.sectionId)) {\n          seenSectionIds.add(item.sectionId);\n          result.push(item);\n        }\n      });\n      return result;\n    },\n    // 路段上浮起来的路段名\n    roadMarker: function roadMarker(item) {\n      if (item && item.linePoints) {\n        var linePoints = JSON.parse(\"[\".concat(item.linePoints, \"]\"));\n        var zj = parseInt(linePoints.length / 2);\n        var langlat = linePoints[zj];\n        //大的marker\n        var el = document.createElement(\"div\");\n        var w = item.sectionName.length * 16;\n        el.id = \"marker\" + item.sectionId;\n        // el.addClass(\"rodeMarkerDiv\")\n        el.className = \"rodeMarkerDiv\";\n        el.style[\"background-image\"] = \"url(\".concat(markerbg, \")\");\n        el.style[\"background-size\"] = \"100% 100%\";\n        el.style[\"padding\"] = \"6px 0\";\n        el.style[\"height\"] = \"74px\";\n        el.style[\"width\"] = w + \"px\";\n        el.style[\"text-align\"] = \"center\";\n        el.style[\"font-size\"] = \"16px\";\n        var spn = document.createElement(\"span\");\n        spn.innerHTML = item.sectionName;\n        spn.style[\"color\"] = \"#fff\";\n        spn.style[\"font-style\"] = \"italic\";\n        el.appendChild(spn);\n\n        //小的marker\n        var el1 = document.createElement(\"div\");\n        var w1 = item.sectionName.length * 12;\n        el1.id = \"marker\" + item.sectionId;\n        // el.addClass(\"rodeMarkerDiv\")\n        el1.className = \"rodeMarkerDiv1\";\n        el1.style[\"background-image\"] = \"url(\".concat(markerbg, \")\");\n        el1.style[\"background-size\"] = \"100% 100%\";\n        el1.style[\"padding\"] = \"0\";\n        el1.style[\"height\"] = \"45px\";\n        el1.style[\"width\"] = w1 + \"px\";\n        el1.style[\"text-align\"] = \"center\";\n        el1.style[\"font-size\"] = \"12px\";\n        var spn1 = document.createElement(\"span\");\n        spn1.innerHTML = item.sectionName;\n        spn1.style[\"color\"] = \"#fff\";\n        spn1.style[\"font-style\"] = \"italic\";\n        el1.appendChild(spn1);\n        // el.style.display = \"none\";\n        el1.style.display = \"block\";\n        //全国显示小图标 否则显示大图标\n        // if (this.$store.state.road.selectRoadId) {\n        //     el.style.display = \"none\";\n        //     el1.style.display = \"block\";\n        // } else {\n        //     el.style.display = \"block\";\n        //     el1.style.display = \"none\";\n        // }\n\n        var halfw = 0 - w / 2;\n        var halfw1 = 0 - w1 / 2;\n        // var marker = new minemap.Marker(el, { offset: [halfw, -70] })\n        //     .setLngLat(langlat)\n        //     .addTo(this.map);\n        var marker1 = new minemap.Marker(el1, {\n          offset: [halfw1, -40]\n        }).setLngLat(langlat).addTo(this.map);\n        // this.markerList[\"marker\" + item.sectionId] = marker;\n        this.markerList[\"marker1\" + item.sectionId] = marker1;\n        // this.markerDomListID.push(el);\n        this.markerDomListID.push(el1);\n      }\n    },\n    // 地图上标记点\n    markPoint: function markPoint(iconSize) {\n      var _this7 = this;\n      var style = [{\n        url: require(\"../img/blue_icon.png\"),\n        anchor: new AMap.Pixel(6, 6),\n        size: new AMap.Size(iconSize, iconSize)\n      }, {\n        url: require(\"../img/yellow_icon.png\"),\n        anchor: new AMap.Pixel(6, 6),\n        size: new AMap.Size(iconSize, iconSize)\n      }, {\n        url: require(\"../img/red_icon_point.png\"),\n        anchor: new AMap.Pixel(6, 6),\n        size: new AMap.Size(iconSize, iconSize)\n      }\n      // {\n      //   url: require('../img/cyan-icon.png'),\n      //   anchor: new AMap.Pixel(6, 6),\n      //   size: new AMap.Size(iconSize, iconSize),\n      // },\n      ];\n\n      var mass = new AMap.MassMarks(null, {\n        opacity: 1,\n        zIndex: 111,\n        zooms: [3, 19],\n        cursor: 'pointer',\n        style: style\n      });\n      mass.setData(this.bridgeCoordinateList);\n      this.massMarks = mass;\n      var marker = new AMap.Marker({\n        content: ' ',\n        map: this.map\n      });\n      var infoWindow = new AMap.InfoWindow({});\n      mass.on('click', function (e) {\n        marker.setPosition(e.data.lnglat);\n        _this7.createInfoWindow(infoWindow, e.data);\n      });\n      mass.setMap(this.map);\n      //   this.createInfoWindow(infoWindow, this.bridgeCoordinateList[0])\n    },\n    // 创建信息窗体\n    createInfoWindow: function createInfoWindow(infoWindow, _data) {\n      var Content = Vue.extend({\n        template: '<info-window-vue :infoData=data />',\n        name: 'infoWindow',\n        components: {\n          'info-window-vue': InfoWindowVue\n        },\n        data: function data() {\n          return {\n            data: _data\n          };\n        }\n      });\n      var component = new Content().$mount();\n      infoWindow.setContent(component.$el);\n      infoWindow.open(this.map, _data.lnglat);\n      Vue.prototype.infoWindow = infoWindow;\n    },\n    // 桥梁列表数据得到具体坐标位置\n    getBridgrCoordinate: function getBridgrCoordinate(params) {\n      var _this8 = this;\n      this.$http.post('${yhxt}/bizBridgeInformation/v1/getJson', params).then(function (res) {\n        var data = res.data.rows || [];\n        var list = [];\n        data.forEach(function (i) {\n          if (i.lng && i.lat) {\n            list.push(_objectSpread({\n              lnglat: [i.lng, i.lat],\n              style: 3\n            }, i));\n          }\n        });\n        _this8.bridgeCoordinateList = list;\n        // 添加点标记\n        console.log(\"桥梁数据\", _this8.bridgeCoordinateList);\n        _this8.markPoint(30);\n      });\n    },\n    cleatMarker: function cleatMarker() {\n      this.markers.forEach(function (item) {\n        item.remove();\n        item = null;\n      });\n      this.markers = [];\n    },\n    // minemap 方法\n    minemapMarker: function minemapMarker() {\n      var _this9 = this;\n      // type字段：1：悬索桥  2：斜拉桥  3：梁桥  4：拱桥\n      var img = [require(\"../img/icon-bridge-1.png\"), require(\"../img/icon-bridge-2.png\"), require(\"../img/icon-bridge-3.png\"), require(\"../img/icon-bridge-4.png\")];\n      // state字段：1：基本完好 2：轻微异常 3：中等异常 4：严重异常\n      var img2 = [require(\"../img/icon-point-1.png\"), require(\"../img/icon-point-2.png\"), require(\"../img/icon-point-3.png\"), require(\"../img/icon-point-4.png\")];\n      this.bridgeCoordinateList.forEach(function (item) {\n        // 创建窗体\n        // let Content = Vue.extend({\n        //   template: '<info-window-vue :infoData=item />',\n        //   name: 'infoWindow',\n        //   components: {\n        //     'info-window-vue': InfoWindowVue,\n        //   },\n        //   data() {\n        //     return {\n        //       item,\n        //     }\n        //   },\n        // })\n\n        // 创建div作为标记点\n        var el = document.createElement('div');\n        el.className = 'map-point';\n        var p1 = document.createElement('div');\n        p1.className = 'text-box text-box-bg-' + item.state;\n        p1.innerHTML = item.bridgeName;\n        var p2 = document.createElement('div');\n        p2.className = 'icon-box icon-point-' + item.state;\n        var p3 = document.createElement('div');\n        p3.className = 'icon-bridge icon-bridge-' + item.type;\n        p2.appendChild(p3);\n        el.appendChild(p1);\n        el.appendChild(p2);\n\n        // el.id = 'marker'\n        // el.style['background-size'] = 'cover'\n        // el.style.width = '60px'\n        // el.style.height = '60px'\n        // el.style['background-image'] = `url(${img2[item.style]})`\n        // 标记点位\n        var marker = new minemap.Marker(el, {\n          offset: [-10, -10]\n        }).setLngLat(item.lnglat).addTo(_this9.map);\n        _this9.markers.push(marker);\n        // 添加点击事件\n        el.addEventListener('click', function () {\n          _this9.$refs.infoDialog.open(item);\n          //   let component = new Content().$mount().$el\n          //   let popup = new minemap.Popup({\n          //     closeOnClick: true,\n          //     closeButton: true,\n          //     offset: [0, 0],\n          //     anchor: 'top',\n          //   }).setDOMContent(component)\n          //   //panTo方法，以动画的形式将地图的中心位置平移到参数中的目标坐标点，参数为地图坐标点\n          //   this.map.panTo([item.lnglat[0], item.lnglat[1] - 1])\n          //   marker.setPopup(popup)\n        });\n      });\n    },\n    //路段过滤\n    getLastLevelIds: function getLastLevelIds(orgData) {\n      var lastLevelIds = [];\n      function recurse(items) {\n        items.forEach(function (item) {\n          // 如果当前项没有子项，说明它是最后一层\n          if (!item.chirldren) {\n            lastLevelIds.push(item.id);\n          } else {\n            // 如果有子项，递归遍历子项\n            recurse(item.chirldren);\n          }\n        });\n      }\n      recurse(orgData.chirldren);\n      return lastLevelIds;\n    },\n    loadData: function loadData() {\n      var _this10 = this;\n      this.$http.get('${yhxt}/road/roadmanage/v1/roadTree').then(function (res) {\n        var data = res && res.status == 200 && res.data || [];\n        _this10.deepSetChildren(data); // 设置路段的children为null\n        _this10.options = [{\n          isDelete: '0',\n          id: '1419863231459102720',\n          name: '全国',\n          parentId: '0',\n          code: '10',\n          grade: '1',\n          orgKind: 'ogn',\n          demId: '1258608622670319616',\n          orderNo: 145,\n          isMaster: 0,\n          path: '1258608622670319616.1419863231459102720.',\n          pathName: '/中铁建昆仑投资集团',\n          limitNum: 0,\n          exceedLimitNum: 0,\n          disabled: false,\n          chirldren: data\n        }];\n        _this10.getRouteMarke();\n        // this.filterRoadId = this.getLastLevelIds(this.options[0])\n        // console.log('this.option', this.getLastLevelIds(this.options[0]))\n        // console.log('this.options', this.options)\n      });\n    },\n    deepSetChildren: function deepSetChildren(data) {\n      var _this11 = this;\n      data.forEach(function (i) {\n        var child = i.chirldren;\n        if (child && child.length !== 0) {\n          return _this11.deepSetChildren(child);\n        } else {\n          i.chirldren = null;\n        }\n      });\n      return data;\n    },\n    selectedRoadList: function selectedRoadList(list) {\n      var _this12 = this;\n      var lastLevelIds = [];\n      function recurse(items) {\n        items.forEach(function (item) {\n          // 如果当前项没有子项，说明它是最后一层\n          if (!item.children.length || !item.children) {\n            lastLevelIds.push(item.data.id);\n          } else {\n            // 如果有子项，递归遍历子项\n            recurse(item.children);\n          }\n        });\n      }\n      if (list.children.length) {\n        recurse(list.children);\n      } else {\n        lastLevelIds = [list.data.id];\n      }\n      this.clearRoadLayer();\n      this.selectLineLayer = lastLevelIds;\n      this.selectLineLayer.forEach(function (item) {\n        var url = '${yhxt}' + \"/bizRoadMapPoint/v1/road/\".concat(item);\n        _this12.$http.get(url).then(function (res) {\n          _this12.getAddLineLayer(res.data);\n          // this.roadMarker(res.data)\n        });\n      });\n\n      return lastLevelIds;\n    },\n    //路图层清除\n    clearRoadLayer: function clearRoadLayer() {\n      //清除已有的线路的图层和路况\n      if (this.selectLineLayer.length > 0) {\n        for (var index = 0; index < this.selectLineLayer.length; index++) {\n          var sid = this.selectLineLayer[index];\n          this.map.getSource(\"linesource\" + sid + \"1\") && this.map.removeSource(\"linesource\" + sid + \"1\");\n          this.map.getSource(\"linesource\" + sid + \"2\") && this.map.removeSource(\"linesource\" + sid + \"2\");\n          this.map.getLayer(\"linelayer\" + sid + \"1\") && this.map.removeLayer(\"linelayer\" + sid + \"1\");\n          this.map.getLayer(\"linelayer\" + sid + \"2\") && this.map.removeLayer(\"linelayer\" + sid + \"2\");\n          this.map.getLayer(\"linesymbollayer\" + sid + \"1\") && this.map.removeLayer(\"linesymbollayer\" + sid + \"1\");\n          this.map.getLayer(\"linesymbollayer\" + sid + \"2\") && this.map.removeLayer(\"linesymbollayer\" + sid + \"2\");\n          // if (this.selectSingle) {\n          //     // this.markerList[\"marker\" + sid].remove();\n          //     this.markerList[\"marker1\" + sid].remove();\n          // }\n          if (this.markerList[\"marker1\" + sid]) {\n            this.markerList[\"marker1\" + sid].remove();\n          }\n\n          // console.log('this.mar--->>>', this.markerList[\"marker1\" + sid]);\n        }\n      }\n\n      this.selectLineLayer = [];\n      this.markerDomListID = [];\n    }\n  }\n};",null]}