派生自 wuyushui/SewerAndRainNetwork

徐旺旺
2021-04-20 7d02699a0b2d425f3f9f3dd6af872bbc1d352710
src/components/LayerController/service/WfsLayerService.js
@@ -1,9 +1,9 @@
/**
 * 加载业务数据图层
 */
import styles from '../../../conf/Styles'
import { STYLES } from '../../../conf/Constants'
import AjaxUtils from '../../../utils/AjaxUtils'
import { setZIndex } from '../../../utils/utils'
class WfsLayerService {
  constructor (config) {
@@ -11,8 +11,8 @@
    this.params = {
      version: '1.0.0',
      REQUEST: 'getfeature',
      OUTPUTFORMAT: 'json',
      maxFeatures: 20000
      OUTPUTFORMAT: 'json'
      // maxFeatures: 20000
    }
    this.popupComp = window.popupComp
    this.L = window.L
@@ -29,22 +29,26 @@
  }
  loadData (wfsUrl) {
    AjaxUtils.get4JsonDataByUrl(wfsUrl, this.params, (res) => this.draw(res.data.features))
    AjaxUtils.get4JsonDataByUrl(wfsUrl, this.params, (res) => {
      this.draw(res.data.features)
    })
  }
  draw (features) {
    const icon = this.config.icon
    this.L.geoJSON(features, {
    const styles = this.config.styles
    Object.assign(STYLES, styles)
    const geojsonLayer = this.L.geoJSON(features, {
      style: function (feature) {
        return {
          fill: styles.defaultLineStyle.fill,
          weight: styles.defaultLineStyle.weight,
          fillColor: styles.defaultLineStyle.fillColor,
          color: styles.defaultLineStyle.color,
          fillOpacity: styles.defaultLineStyle.fillOpacity,
          opacity: styles.defaultLineStyle.opacity,
          dashArray: styles.defaultLineStyle.dashArray,
          dashSpeed: styles.defaultLineStyle.dashSpeed
          fill: STYLES.FILL,
          weight: STYLES.WEIGHT,
          fillColor: STYLES.FILL_COLOR,
          color: STYLES.COLOR,
          fillOpacity: STYLES.FILL_OPACITY,
          opacity: STYLES.OPACITY
          // dashArray: STYLES.DASH_ARRAY,
          // dashSpeed: STYLES.DASH_SPPED
        }
      },
      pointToLayer: (geoJsonPoint, latlng) => {
@@ -53,7 +57,7 @@
            img: {
              // url: 'assets/images/map/marker-icon.png',
              url: '/assets/images/map/' + icon,
              size: styles.defaultLineStyle.size
              size: STYLES.ICON_SIZE
            }
          })
      },
@@ -72,6 +76,7 @@
          .on('mouseover', (e) => this.mouseOverListener(e, layer)).on('mouseout', (e) => this.mouseOutListener(e, layer))
      }
    }).addTo(this.layer)
    setZIndex(geojsonLayer)
  }
  mouseOverListener (e, layer) {
@@ -94,13 +99,13 @@
    const icon = this.config.icon
    const type = e.target.feature.geometry.type
    if (type === 'LineString' || type === 'MultiLineString') {
      layer.setStyle({ weight: styles.defaultLineStyle.weight, color: styles.defaultLineStyle.color })
      layer.setStyle({ weight: STYLES.WEIGHT, color: STYLES.COLOR })
    }
    if (type === 'Point' || type === 'MultiPoint') {
      layer.setStyle({
        img: {
          url: '/assets/images/map/' + icon,
          size: styles.defaultLineStyle.size
          size: STYLES.ICON_SIZE
        }
      })
    }