diff --git a/src/views/AppMap.vue b/src/views/AppMap.vue index 9bdf9f8..eb0d288 100644 --- a/src/views/AppMap.vue +++ b/src/views/AppMap.vue @@ -16,17 +16,18 @@ export default { watch: { search: { deep: true, handler() { - this.getData().then(() => this.refreshData()) + this.getData().then(() => this.refreshData("watch search")) } }, thirdGoods: { deep: true, handler() { - this.getData().then(() => this.refreshData()) + this.getData().then(() => this.refreshData("watch thirdGoods")) } }, }, methods: { loadLib() { + const {$loadScript} = window return Promise.all([ '/presource/datascreen/js/turf.min.js', ].map(e => $loadScript('js', e))) @@ -63,7 +64,7 @@ export default { return this.geoJson = {type: 'FeatureCollection', features: maps.flat(1)} }) }, - async initMap() { + initMap() { const {echarts, turf, $waitFor} = window const boundary = turf.union(this.geoJson) boundary.properties.name = "boundary" @@ -71,6 +72,7 @@ export default { echarts.registerMap('zhengzhou', this.geoJson) $waitFor(this.$el).then(() => { this.map = echarts.init(this.$el) + if (!this.map) return setTimeout(() => this.initMap(), 500) const areaColor = { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [ {offset: 0, color: 'rgba(61,127,255,0.35)'}, @@ -119,7 +121,7 @@ export default { this.$marketBoard.screenId = 'a90522ef-869b-40ea-8542-d1fc9674a1e8' } }) - this.refreshData() + this.refreshData("initMap") }) }, convertData(layers) { @@ -135,16 +137,16 @@ export default { }) return Object.values(result).map(data => ({data})) }, - refreshData() { + refreshData(from) { + console.log("refreshData调用位置:", from) const {thirdGoods: {goodsName}} = this const title = {left: 20, top: 20, text: goodsName ? `{sub|选择产品:}${goodsName}` : '', textStyle: {color: "#fff", rich: {sub: {color: "#fff", fontSize: 16}}}} - this.map.setOption({title, series: this.convertData(this.layers)}) + if (!this.map) return this.initMap() + this.map?.setOption({title, series: this.convertData(this.layers)}) }, }, mounted() { - this.loadLib().then(() => Promise.all([ - this.getData(), - ])).then(() => this.initMap()) + this.loadLib().then(() => this.getData()).then(() => this.initMap()) } }