geojson 数据下载地址:https://hxkj.vip/demo/echartsMap/
可下载的数据包含省级geojson行政边界数据、市级geojson行政边界数据、区/县级geojson行政边界数据、省市区县街道行政编码四级联动数据(可精确到乡镇/街道级)
一、通过API接口,实时获取最新中国省市区县geoJSON格式地图数据,可用于Echarts地图展示
1、效果图如下


2、示例代码
downloadMapCode() {// 下载mapCode数据
let mapCode = [], cityMapCode = [], provinceMapCode = [], provinceList = [], cityList = [],
districtList = [];
provinceList = this.codeList.filter(item => {
return item.level === 'province'
})
cityList = this.codeList.filter(item => {
return item.level === 'city'
})
districtList = this.codeList.filter(item => {
return item.level === 'district'
})
districtList.forEach(item => {
mapCode.push({
name: item.name,
cityCode: item.code,
fatherCode: `${item.code.substring(0, 4)}00`,
children: []
})
})
// 筛选出直辖市下面的区县
let direct = mapCode.filter(item => {
return item.fatherCode.includes('0000');
})
for (let i in cityList) {
let children = []
for (let j in mapCode) {
if (mapCode[j].fatherCode == cityList[i].code) {
children.push(mapCode[j])
}
}
cityMapCode.push({
name: cityList[i].name,
cityCode: cityList[i].code,
fatherCode: `${cityList[i].code.substring(0, 2)}0000`,
children: children
})
}
cityMapCode = cityMapCode.concat(direct);
for (let i in provinceList) {
let children = []
for (let j in cityMapCode) {
if (cityMapCode[j].fatherCode == provinceList[i].code) {
children.push(cityMapCode[j])
}
}
provinceMapCode.push({
name: provinceList[i].name,
cityCode: provinceList[i].code,
fatherCode: '100000',
children: children
})
}
if (provinceMapCo

该博客介绍了如何通过API接口获取最新的中国省市区县GeoJSON地图数据,并用于Echarts展示。示例代码展示了如何实现数据的下载、整理以及联动效果。此外,还提供了自动更新数据的方案,包括获取所有级别的行政编码和加载GeoJSON数据。
最低0.47元/天 解锁文章
5568

被折叠的 条评论
为什么被折叠?



