派生自 wuyushui/SewerAndRainNetwork

徐旺旺
2021-05-20 ec4d5c1827487f4c901b69bd9eae58e111e82b32
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import L from 'leaflet'
import eventBus from '../../../../../eventBus'
 
class DrawLine {
  constructor (map) {
    this.points = []
    this.color = 'red'
    this.layers = L.layerGroup()
    this.polyline = null
    this.marker = null
    this.points = []
    this.polyline = null
    this.marker = null
    this.map = map
  }
 
    init = () => {
      this.map.on('click', this.click)
      this.map.on('mousemove', this.mousemove)
      this.map.on('dblclick', this.dbClick)
    }
 
    click = (e) => {
      this.map.doubleClickZoom.disable()
      this.points.push(e.latlng)
      if (this.points.length > 1) {
        this.dbClick()
      }
    }
 
    mousemove = (e) => {
      this.points.push(e.latlng)
      if (this.polyline) { this.map.removeLayer(this.polyline) }
      this.polyline = L.polyline(this.points, { showMeasurements: false, color: 'red' })
      this.polyline.addTo(this.layers)
      this.layers.addTo(this.map)
      this.points.pop()
    }
 
    dbClick = (e) => {
      this.polyline.addTo(this.layers)
      this.map.off('click', this.click).off('mousemove', this.mousemove).off('dblclick', this.dbClick)
      eventBus.$emit('draw-hdm-line', this.points)
    }
 
    destory () {
      if (this.polyline) { this.map.removeLayer(this.polyline) }
      if (this.marker) { this.marker.remove() }
      this.points = []
      this.layers.clearLayers()
    }
}
 
export default DrawLine