派生自 wuyushui/SewerAndRainNetwork

wangqi
2021-03-31 dd8aebad69a2311e5f526a0c6bbce956dea77861
src/components/BaseNav/SolidWaste/SolidWaste.js
@@ -52,20 +52,24 @@
        // var url = Icon.options.iconUrl
        const marker = this.L.marker([positionX, positionY], { icon: Icon })
        // 划过出现 展示数据
        marker.bindTooltip(data[i].Name, {
          permanent: true,
          offset: [0, 16],
          direction: 'bottom',
          offset: [0, -16],
          direction: 'top',
          className: ''
        })
        // 点击 事件
        marker.on('click', (e) => {
          try {
            // console.log(e)
            // console.log(this.map.getCenter())
            // console.log(this.map.setCenter([e.target.getLatLng().lat, e.target.getLatLng().lng]))
            // this.map.flyTo([e.target.getLatLng().lat, e.target.getLatLng().lng])
            // this.map.panTo([e.target.getLatLng().lat, e.target.getLatLng().lng], 100)
            this.setPanTo(e.target.getLatLng(), 250)
            this.EffectOfPulse(e.target.getLatLng())
            this.SolidWastePopup.setData(data[i])
            // this.SolidWastePopup.setData(data[i], 'gufei')
            return this.SolidWastePopup.$el
          } catch (error) {
            console.log(error)
@@ -75,6 +79,17 @@
        this.SolidWasteLayerGroup.addLayer(marker)
      }
    }
  }
  // panTo
  setPanTo (pos, value) {
    var position = pos
    position = this.map.latLngToLayerPoint(position)
    position.y += value
    position = this.map.layerPointToLatLng(position)
    // this.map.setView(position)
    this.map.flyTo(position)
    // this.map.panTo(position)
  }
  // 固废点击进行的 内容的设置
@@ -106,33 +121,33 @@
  // 脉冲效果设置实现
  EffectOfPulse (position, markers, layerGroup) {
    // // 区分直接执行 和判断执行的不同区别
    var differentColor = ''
    if (markers) {
      differentColor = '#ff0000'
    } else {
      differentColor = '#98FB98'
    }
    // 坐标数据:报警传进来的是数组 / 点击传进来的是object
    var FinalPosition = position instanceof Array ? {
      lat: position[0],
      lng: position[1]
    } : position
    // 插件 效果实现
    var pulsingIcon = this.L.icon.pulse({
      iconSize: [20, 20],
      color: differentColor,
      fillColor: ''
    })
    if (markers) {
      // markers.push(this.L.marker(FinalPosition, { icon: pulsingIcon }))
      // this.L.layerGroup(markers).addLayer(layerGroup)
    } else {
      var picGroupMarker = new this.L.FeatureGroup()
      this.L.marker(FinalPosition, { icon: pulsingIcon }).addTo(picGroupMarker)
      this.pulseHeighLightMarker = picGroupMarker.addTo(this.SolidWasteLayerGroup)
      this.PulseCountSetting()
    }
    // 区分直接执行 和判断执行的不同区别
    // var differentColor = ''
    // if (markers) {
    //   differentColor = '#ff0000'
    // } else {
    //   differentColor = '#98FB98'
    // }
    // // 坐标数据:报警传进来的是数组 / 点击传进来的是object
    // var FinalPosition = position instanceof Array ? {
    //   lat: position[0],
    //   lng: position[1]
    // } : position
    // // 插件 效果实现
    // var pulsingIcon = this.L.icon.pulse({
    //   iconSize: [20, 20],
    //   color: differentColor,
    //   fillColor: ''
    // })
    // if (markers) {
    //   // markers.push(this.L.marker(FinalPosition, { icon: pulsingIcon }))
    //   // this.L.layerGroup(markers).addLayer(layerGroup)
    // } else {
    //   var picGroupMarker = new this.L.FeatureGroup()
    //   this.L.marker(FinalPosition, { icon: pulsingIcon }).addTo(picGroupMarker)
    //   this.pulseHeighLightMarker = picGroupMarker.addTo(this.SolidWasteLayerGroup)
    //   this.PulseCountSetting()
    // }
  }
  // 对图标脉冲 进行set设置  // 高亮图层
@@ -140,7 +155,6 @@
    var HeightLightTime = 5
    var PulseNumber = 5
    const pulseinterver = setInterval((e) => {
      console.log(e)
      if (PulseNumber > 0) {
        PulseNumber--
      } else {