67 lines
2.3 KiB
Vue
67 lines
2.3 KiB
Vue
|
<template>
|
|||
|
|
<div class="dike-hazards-monitor">
|
|||
|
|
<layer-label :label-data="layerData" />
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import LayerLabel from './LayerLabel'
|
|||
|
|
export default {
|
|||
|
|
name: 'ComBaseLayer',
|
|||
|
|
components: {
|
|||
|
|
LayerLabel
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
layerData: [],
|
|||
|
|
layerId: 'comBaseLayer',
|
|||
|
|
layers: {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.initLayer()
|
|||
|
|
},
|
|||
|
|
beforeDestroy() {
|
|||
|
|
// 移除图层相关
|
|||
|
|
Object.keys(this.layers).forEach(key => {
|
|||
|
|
this.layers[key] && this.layers[key].destroy()
|
|||
|
|
this.layers[key] = null
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
initLayer() {
|
|||
|
|
this.layers[this.layerId] = new this.$esri.GraphicsLayer({
|
|||
|
|
id: this.layerId,
|
|||
|
|
graphics: [],
|
|||
|
|
spatialReference: this.$mapView['map'].spatialReference,
|
|||
|
|
visible: true
|
|||
|
|
})
|
|||
|
|
this.$mapView['map'].map.add(this.layers[this.layerId], 1)
|
|||
|
|
|
|||
|
|
// 添加图层点击事件
|
|||
|
|
const clickHandle = this.$mapView['map'].on('click', event => {
|
|||
|
|
this.$mapView['map'].hitTest(event).then(response => {
|
|||
|
|
if (response.results.length) {
|
|||
|
|
const graphic = response.results[0]?.graphic
|
|||
|
|
if (graphic?.layer === this.layers[this.layerId]) {
|
|||
|
|
// this.$store.commit('CommonMap/setCurrentMapFeature', {
|
|||
|
|
// layerId: this.layerId,
|
|||
|
|
// graphic: graphic,
|
|||
|
|
// isLocation: true,
|
|||
|
|
// isHighlight: true,
|
|||
|
|
// view: 'map'
|
|||
|
|
// })
|
|||
|
|
this.$store.commit('FinalCommonBox/setVideoData', graphic.attributes)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}}
|
|||
|
|
}
|
|||
|
|
</script>
|