为地图增加颜色
This commit is contained in:
@@ -686,7 +686,7 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
renderMap(areaId, cb) {
|
||||
renderMap(areaId, reload = true) {
|
||||
const mapGeo = this.$copy(weiyang)
|
||||
let scatters = []
|
||||
if (areaId) {
|
||||
@@ -699,8 +699,23 @@ export default {
|
||||
})
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
const colors = {
|
||||
三桥街道: "#EBADC8",
|
||||
建章路街道: "#B886EA",
|
||||
未央宫街道: "#A8B4F0",
|
||||
六村堡街道: "#35FDFC",
|
||||
汉城街道: "#37FBB9",
|
||||
张家堡街道: "#D8F98A",
|
||||
草滩街道: "#25B3F8",
|
||||
未央湖街道: "#73DCFC",
|
||||
徐家湾街道: "#F3C83F",
|
||||
谭家街道: "#FD9004",
|
||||
辛家庙街道: "#F3C83F",
|
||||
大明宫街道: "#FB3744",
|
||||
}
|
||||
const regions = Object.entries(colors).map(([name, color]) => ({name, itemStyle: {areaColor: `${color}80`, borderColor: color, borderWidth: 1}}))
|
||||
const options = this.$refs.map.handleMapOps(mapGeo, {
|
||||
geo: {label: {show: false}},
|
||||
geo: {label: {show: false}, regions},
|
||||
series: {
|
||||
type: 'effectScatter', coordinateSystem: 'geo', itemStyle: {color: '#4DF6FF'},
|
||||
select: {itemStyle: {color: '#FFC800'}},
|
||||
@@ -721,10 +736,18 @@ export default {
|
||||
${["mapResidentCount", "mapResidentGroupCount", "mapWorkOrderCount"].map(prop => `<div class="flex" style="line-height: 22px;">
|
||||
<span class="fill" style="color:#99B5D2">${this.getLabel(prop)}</span> ${item[prop] || 0}</div>`).join("")}</div>`
|
||||
}
|
||||
}
|
||||
},
|
||||
// toolbox: {
|
||||
// feature: {restore: {title: "重置"}},
|
||||
// }
|
||||
}, true)
|
||||
if (cb) cb(mapGeo, options)
|
||||
else this.chart.map.setOption(options)
|
||||
this.map = mapGeo
|
||||
this.mapOps = options
|
||||
this.chart.map.dispatchAction({type: 'restore'})
|
||||
if (reload) {
|
||||
this.chart.map.clear()
|
||||
this.chart.map.setOption(options)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleBack() {
|
||||
@@ -735,10 +758,7 @@ ${["mapResidentCount", "mapResidentGroupCount", "mapWorkOrderCount"].map(prop =>
|
||||
this.renderMap()
|
||||
} else if (lv == 4) {
|
||||
this.areaId = Area.getAreaCodeByLevel(areaCode, lv - 1)
|
||||
this.renderMap(this.areaId, (geo, ops) => {
|
||||
this.map = geo
|
||||
this.mapOps = ops
|
||||
})
|
||||
this.renderMap(this.areaId, false)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -116,6 +116,9 @@ export default {
|
||||
initChart() {
|
||||
const {echarts} = window
|
||||
this.chart = echarts.init(this.$refs.dvMap)
|
||||
this.chart.on('finished', () => {
|
||||
console.log(this.chart.getOption())
|
||||
})
|
||||
this.chart.showLoading({
|
||||
text: "数据加载中...", textColor: "#fff",
|
||||
maskColor: 'rgba(0, 0, 0, 0.2)'
|
||||
|
||||
Reference in New Issue
Block a user