一、通过其他平台提供的Geojson,对echarts引入配置
推荐:
1、
地址
2、TangSY
地址
地址2
二、提供的Geojson与实际可能会有误差,比如区域重新划分等,这就需要对Geojson重新完善
推荐使用geojson.io进行自定义编辑,平台提供对原json文件修改或自己完全自定义制作(太麻烦,需要耐心,自己一点一点勾画)
地址
1、导入json文件
导入后效果:
2、编辑
点击对应区域块编辑json具体内容
3、对错误的区块删除重新绘制
重新勾画新区域
添加其他配置项,如name
3、将右侧对应json内容复制,加载Geojson文件,预览效果
$.get('resources/plugin/echarts3/ningbo.json', function (nbJson) {
echarts.registerMap('ningbo', nbJson);
mapChart = echarts.init(document.getElementById('areaMap'));
loadMapData();
});
map option中series的“mapType”要写上面注册的“ningbo”
{
name: '',
type: 'map',
mapType: 'ningbo',
.....
}
三、其他,部分区域名称位置会有偏差,不居中
通过修改json 中 “cp”: [118.442875, 39.743634], 修改名称位置
"properties": {
"adcode": 130204,
"name": "古冶区",
"cp": [118.442875, 39.743634],
"center": [
118.45429,
39.715736
],
"centroid": [
118.438492,
39.717037
],
"childrenNum": 0,
"level": "district",
"parent": {
"adcode": 130200
},
"subFeatureIndex": 2,
"acroutes": [
100000,
130000,
130200
]
},
坐标可通过百度地图坐标拾取 查找
地址