管线分析

ChenZeping

2021-04-29 dc1884bc0afc8c4547a056c7ff0b9e78467b5dfc

管线分析

 src/api/mapUrl.js

@@ -30,10 +30,8 @@
export const getCompany = $HOST + '/company/getCompany'

// 管线分析
// export const findPipelineByClickPoint = $HOST + '/findPipelineByClickPoint'
export const findPipelineByClickPoint = 'http://xearth.cn:6202' + '/findPipelineByClickPoint'
export const findConnectedPipelines = 'http://xearth.cn:6202' + '/findConnectedPipelines'
// export const findConnectedPipelines = $HOST + '/findConnectedPipelines'
export const findFlowDirection = 'http://xearth.cn:6202' + '/findFlowDirection'
export const findLeakages = 'http://xearth.cn:6202' + '/findLeakages'
export const getCrossSection = 'http://xearth.cn:6202' + '/getCrossSection'

 src/components/LayerController/service/WfsLayerService.js

@@ -73,7 +73,11 @@
            closeButton: false,
            autoClose: false
          })
            .bindTooltip((layer) => this.tooltipListener(layer), { direction: 'bottom', offset: [0, 15], sticky: true })
          layer.bindTooltip((layer) => this.tooltipListener(layer), {
            direction: 'bottom',
            offset: [0, 15],
            sticky: true
          })
            .on('mouseover', (e) => this.mouseOverListener(e, layer)).on('mouseout', (e) => this.mouseOutListener(e, layer))
        }
      }).addTo(this.layer)

 src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue

@@ -465,6 +465,7 @@
      this.clearLX()
      this.linkClear()
      this.jdmClear()
      this.currentLinkIsTrue = ''
      this.bgFm = []
      this.bgPipeLine = []
      this.tableData = []
@@ -503,7 +504,9 @@
        this.bgPipeLine = res.data
      } else if (this.activeName === 'third') {
        this.tableDataLiuxiang = res.data
      } else if (this.activeName === 'fourth') {}
      } else if (this.activeName === 'fourth') {
      }
      // debugger
      console.log(res.data)
    },
    // 流向显示 的方法参数封
@@ -511,6 +514,22 @@
      const flowLine = window.L.polyline(param.points, param.option)
      flowLine.addTo(window.map)
      return flowLine
    },
    createFlowMarker (point) {
      return window.L.marker(point, {
        icon: window.L.divIcon({
          className: 'dIcon',
          html: '<div class="plane live">' +
              // '<img src="'+require("../../assets/images/map/ship.png")+
              '<div style="position: absolute;' +
              '    width: 20px;' +
              '    height: 20px;' +
              '    border-radius: 50%;' +
              '  content: \'\'; background-color: #FF664A;"/>' +
              '<span></span><span></span></div></>',
          iconSize: [90, 36]
        })
      })
    },

    // 连通性 ===> 地图点击起始管段e
@@ -577,11 +596,13 @@
        this.$message('请选择起始管段和结束管段')
        return false
      }

      // 请求数据时的参数
      const param = {
        startLineID: this.currentSelectStart.id,
        endLineID: this.currentSelectEnd.id
        startLineID: this.currentSelectStart.pipesegcode,
        endLineID: this.currentSelectEnd.pipesegcode
      }
      console.log(param)
      // 请求接口和数据
      const res = await mapApi.findConnectedPipelines(param)
      console.log(res)
@@ -619,23 +640,23 @@
    },
    // 连通性 分析结果table列表数据选择点击事件
    linkResultSelect (e) {
      // console.log('连通性分析结果列表点击')
      // console.log(e)
      console.log('连通性分析结果列表点击')
      console.log(e)

      // const geom = JSON.parse(e.geomText)
      // if (this.currentSelectResultLine != null) {
      //   this.currentSelectResultLine.remove()
      //   this.currentSelectResultLine = null
      // }
      // this.currentSelectResultLine = L.geoJSON(geom, {
      //   style: function (feature) {
      //     return {
      //       color: 'rgba(255,0,0,.6)',
      //       weight: 6
      //     }
      //   }
      // }).addTo(this.map)
      // this.map.panInsideBounds(this.currentSelectResultLine.getBounds())
      const geom = JSON.parse(e.geomText)
      if (this.currentSelectResultLine != null) {
        this.currentSelectResultLine.remove()
        this.currentSelectResultLine = null
      }
      this.currentSelectResultLine = window.L.geoJSON(geom, {
        style: function (feature) {
          return {
            color: 'rgba(255,0,0,.6)',
            weight: 6
          }
        }
      }).addTo(this.map)
      this.map.panInsideBounds(this.currentSelectResultLine.getBounds())
    },
    // 连通性的清除功能
    linkClear () {
@@ -686,7 +707,7 @@

      // 数据请求参数
      const param = {
        lineID: e.id
        lineID: e.pipesegcode
      }
      const res = await mapApi.findLeakages(param)
      console.log(res)
@@ -698,6 +719,7 @@
      }
      res.data.reverse()
      this.bgFm = res.data
      console.log(res.data)

      this.bgPoint = res.data[0].startControlPoint

@@ -705,10 +727,10 @@

      const p = [point.coordinates[1], point.coordinates[0]]

      // this.bgMarker = main.createFlowMarker(p)
      this.bgMarker = this.createFlowMarker(p)
      this.bgMarker.bindTooltip(this.bgPoint.pointnumbe)
      this.bgMarker.addTo(this.map)
      this.map.flyTo(p)
      this.bgMarker.addTo(window.map)
      window.map.flyTo(p)

      const linkPipe = []
      res.data.forEach((itm, idx) => {
@@ -717,7 +739,6 @@
        geom.coordinates.forEach((it, id) => {
          points.push(it.reverse())
        })

        linkPipe.push(points)
      })

@@ -762,17 +783,13 @@
    },
    // 点击显示流向 table列表中的数据 => 进行官网流向的显示
    async lxQuery (e) {
      // console.log(e)
      console.log(e)
      this.clearLinkPipe()
      const param = {
        // lineNodeID: e.startpoint
        lineNodeID: e.gid
        lineNodeID: e.startpointnumber
      }
      const res = await mapApi.findFlowDirection(param)
      this.getres(res)
    },
    // 点击显示流向 table列表中的数据 => 进行官网流向的显示 的数据处理方法
    getres (res) {
      this.lxTableDataResult = res.data
      const linkPipe = []
      res.data.forEach((itm, idx) => {
@@ -797,6 +814,10 @@
        this.linkPipeline.push(line)
      })
    },
    // 点击显示流向 table列表中的数据 => 进行官网流向的显示 的数据处理方法
    // getres (res) {
    //
    // },
    // 清除流向
    clearLX () {
      if (this.flowPipeLine != null) {
@@ -900,7 +921,7 @@
          type: 'line'
        }]
      }
      // this.myChartShow = true
      this.myChartShow = true
      this.myChart.setOption(option)
    },
    // 横断面清除

 src/conf/MapConfig.js

@@ -22,10 +22,10 @@
  minZoom: 3,
  maxZoom: 17,
  // center: [26, 104],
  center: [34.828558921813965, 117.41676807403564],
  zoom: 5,
  // center: [32.25853085517883, 118.78592848777771],
  // zoom: 15,
  // center: [34.828558921813965, 117.41676807403564],
  // zoom: 5,
  center: [32.25853085517883, 118.78592848777771],
  zoom: 15,
  worldCopyJump: true,
  inertia: true,
  zoomControl: false,