修改管网先tooltip样式

YANGDL

2021-03-04 6ffa578934b471302ed9ced5d1813003f8c23cc5

 src/components/helpers/ServiceLayerHelper.js

@@ -72,10 +72,10 @@
  }

  /**
   * 请求wfs数据
   * @param url
   * @param item
   */
     * 请求wfs数据
     * @param url
     * @param item
     */
  loadGeojsonLayer (url, item) {
    var matches = this.regex.exec(url)
    var matchValue = item[matches[1]]
@@ -92,9 +92,9 @@
  }

  /**
   * 加载gis server返回的geoson数据到地图中展示
   * @param res
   */
     * 加载gis server返回的geoson数据到地图中展示
     * @param res
     */
  loadGeojson (res, opt) {
    var that = this
    var icon = opt.icon
@@ -115,7 +115,6 @@
      pointToLayer: function (geoJsonPoint, latlng) {
        return that.L.canvasMarker(latlng,
          {
            radius: 20,
            img: {
              // url: 'assets/images/map/marker-icon.png',
              url: '/assets/images/map/' + icon,
@@ -132,17 +131,47 @@
      minWidth: 300,
      closeButton: false,
      autoClose: false
    }).bindTooltip(function (layer) {
      console.log(layer)
      return layer.feature.properties.name
    }).on('mouseover', function (e) {
      console.log(e)
      var layer = e.layer
      layer.setStyle({ weight: 8, color: '#00ffff' })
    }).on('mouseout', function (e) {
      var layer = e.layer
      layer.setStyle({ weight: styles.defaultLineStyle.weight, color: styles.defaultLineStyle.color })
    }).addTo(featureGroup).tooltip()
    })
      .bindTooltip(function (layer) {
        const nameId = layer.feature.id
        let name = ''
        if (nameId.indexOf('三通') !== -1 || nameId.indexOf('四通') !== -1) {
          name = layer.feature.properties.pointnumber
        } else {
          name = layer.feature.properties.name
        }
        return name
      })
      .on('mouseover', function (e) {
        const layer = e.layer
        const type = e.layer.feature.geometry.type
        if (type === 'LineString' || type === 'MultiLineString') {
          layer.setStyle({ weight: 8, color: '#00ffff' })
        } else if (type === 'Point' || type === 'MultiPoint') {
          layer.setStyle({
            img: {
              url: '/assets/images/map/' + icon,
              size: [25, 25]
            }
          })

          layer.bringToFront()
        }
      }).on('mouseout', function (e) {
        const layer = e.layer
        const type = e.layer.feature.geometry.type
        if (type === 'LineString' || type === 'MultiLineString') {
          layer.setStyle({ weight: styles.defaultLineStyle.weight, color: styles.defaultLineStyle.color })
        }
        if (type === 'Point' || type === 'MultiPoint') {
          layer.setStyle({
            img: {
              url: '/assets/images/map/' + icon,
              size: styles.defaultLineStyle.size
            }
          })
        }
      }).addTo(featureGroup)
    if (Object.prototype.hasOwnProperty.call(res, 'features') && res.features.length > 0 && (res.features[0].geometry.type === 'LineString' || res.features[0].geometry.type === 'MultiLineString')) {
      geojson.bringToBack()
    } else {