美文网首页Gis专辑GIS文章集echarts中国
echart地图使用经验-地图变形和添加数据

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

作者: polong | 来源:发表于2016-12-06 17:58 被阅读270次

                          关于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);}

      })()

},

自定义地图效果

相关文章

网友评论

  • 四爷在此:哦也,不错哟。用Echart确实比较通用。。之前用来做上海出租车轨迹的展示来着。用它官网的地图数据,直接叠上wgs84。比第二代格式要开放些
    polong: @四爷在此 3.0把接口暴露出来了,更好用
  • 1dent1ty:666。echarts3我记得是用decode和decodePolygon方法在内部转换了乱码json为正常json。
    polong: @1dent1ty echart3好像不带地图数据了,要下载的
    polong: @1dent1ty 这个没研究,只是研究变形问题。echart3加载geojson直接暴露出来,用官网的数据差不多可以…
  • 猿基地:挺牛的!
    polong: @猿基地 没事捣鼓下

本文标题:echart地图使用经验-地图变形和添加数据

本文链接:https://www.haomeiwen.com/subject/dyprmttx.html