Echarts地图使用经验-地图变形和添加数据

Posted polong

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Echarts地图使用经验-地图变形和添加数据相关的知识,希望对你有一定的参考价值。

关于echart2,echart3地图的使用一点人生经验:
1.echart3,echart2加载地图变形修复。
最近在使用echart2使用过程中,发现加载海南地图会产生变形。如下图,海南地图产生了较大的变形,于是需要研究怎么才能消除变形。经过一番折腾,修改echart-all.js中_getTransform函数的

varxScale = width /mapWidth;

varyScale = height / mapHeight;

console.log(rate);

if(xScale > yScale) {

     //xScale = yScale * rate;

      xScale = yScale;

      width = mapWidth * xScale;

}else{

      yScale = xScale;

     //xScale = yScale * rate;

     height = mapHeight * yScale;

}

这样地图就能不产生变形(echart3里添加这个aspectScale:1就能使地图不变形)

技术分享图片

技术分享图片

2.echart2中添加自定义geosjon(主要讲的是echart2,echart3里加载geojson已经比较方便)
同样是修改echart-all.js中代码加入如下代码,就能使用mapType为‘hainan‘的地图

‘hainan‘: {getGeoJson: (function() {

       return function(callback) {$.getJSON(‘data/hn.geojson‘,callback);}

      })()

},

技术分享图片




以上是关于Echarts地图使用经验-地图变形和添加数据的主要内容,如果未能解决你的问题,请参考以下文章

Echarts地图使用json数据显示方法

我用的echarts中国地图怎么获取到当前选中的区域id或者名称

eCharts添加自定义geojson数据实现地图展示

echarts地图引入json或者js

地图(用ECharts绘制)

Echarts 地图 省份的颜色自定义如何设置?