使用 echarts 制作中国地图飞线图,发现部分省份的名称错位或重叠,有的都快跑到省份外面去了。解决办法有如下两种:
方法一、可以修改地图文件(JS 或 JSON)中对应省份的 cp
坐标。
这里以 china.js 示例,直接修改 china.js 中 properties 配置项的 cp 值,这个 cp 值代表着坐标定位。注意,js 文件是加密的,但是 properties 是正常显示的,我们直接搜索要修改的省份名称即可。
"properties":{"cp":[119.767413,33.041544],"name":"江苏","childNum":1}
方法二、通过 echarts.getMap('china')
修改已加载的地图数据。
var chinaMapInfoObj = document.getElementById('map');
var chinaMap = echarts.init(chinaMapInfoObj);
var chinaEchartsObj = echarts.getMap('china');
var geoJSONChina = chinaEchartsObj.geoJson;
var allDefProvince = geoJSONChina.features;
for(var i=0,len=allDefProvince.length; i<len; i++){
var sglProvinceProperties = allDefProvince[i].properties;
var sglProvinceName = sglProvinceProperties.name;
switch(sglProvinceName){
case '新疆':
sglProvinceProperties.cp[0]=87.617733;
sglProvinceProperties.cp[1]=41.792818;
break;
case '青海'://def:101.778916,36.623178
sglProvinceProperties.cp[0]=97.617733;
sglProvinceProperties.cp[1]=36.623178;
break;
case '江苏'://def:118.767413,32.041544
sglProvinceProperties.cp[0]=119.767413;
sglProvinceProperties.cp[1]=33.041544;
break;
}
}
option.echarts.registerMap('china', geoJSONChina, {});
想要了解更多内容,请持续关注码农资源网,一起探索发现编程世界的无限可能!
本站部分资源来源于网络,仅限用于学习和研究目的,请勿用于其他用途。
如有侵权请发送邮件至1943759704@qq.com删除
码农资源网 » Echarts 中国地图省份名称错位或者重叠的解决办法
本站部分资源来源于网络,仅限用于学习和研究目的,请勿用于其他用途。
如有侵权请发送邮件至1943759704@qq.com删除
码农资源网 » Echarts 中国地图省份名称错位或者重叠的解决办法