接入地图了

This commit is contained in:
aixianling
2024-09-19 14:50:31 +08:00
parent c1bca77b3f
commit 6a1d86b88a
3 changed files with 83 additions and 12 deletions

View File

@@ -12,7 +12,7 @@ import "../../lib/cdn/turf.min.js";
export default {
name: 'AiEchartMap',
props: {
geoJson: String,
geoJson: {type: [String, Object]},
data: Array,
ops: Object
},
@@ -60,9 +60,13 @@ export default {
})
},
loadLibs() {
return Promise.all([
this.getData(this.geoJson).then(res => this.geo = res?.data)
])
let getGeo
if (typeof this.geoJson === 'string') {
getGeo = this.getData(this.geoJson).then(res => this.geo = res?.data)
} else if (typeof this.geoJson === 'object') {
getGeo = Promise.resolve(this.geo = this.$copy(this.geoJson))
}
return Promise.all([getGeo])
},
initChart() {
const {echarts, turf} = window
@@ -77,7 +81,6 @@ export default {
boundary.properties = {...boundary.properties}
boundary.properties.name = "boundary"
geoJson.features.unshift(boundary)
console.log(geoJson)
echarts.registerMap('customMap', geoJson)
const option = {
geo: {
@@ -94,14 +97,26 @@ export default {
}
],
},
series: [
{type: 'scatter', coordinateSystem: 'geo', itemStyle: {color: '#66FFFF'}},
{type: 'effectScatter', coordinateSystem: 'geo', itemStyle: {color: '#FFD15C'}}
],
...this.ops
}
const assign = (target, source) => {
Object.entries(source).forEach(([key, value]) => {
if (typeof value === 'object') {
if (target[key] && typeof target[key] === 'object') {
assign(target[key], value)
} else {
target[key] = value
}
} else {
target[key] = value
}
})
}
assign(option, this.ops)
this.chart.setOption(option)
}).finally(() => this.chart.hideLoading())
}).finally(() => {
this.$emit('map', this.chart)
this.chart.hideLoading()
})
},
getData(url = `https://geo.datav.aliyun.com/areas_v3/bound/geojson?code=${this.user.info.areaId?.substring(0, 6)}`) {
return http.post(`/app/appdvcpconfig/apiForward?url=${encodeURIComponent(url)}`)