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

最新推荐文章于 2024-05-06 09:19:01 发布

原创最新推荐文章于 2024-05-06 09:19:01 发布 · 420 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#geojson地图

本文分享了如何解决Echarts2中海南地图加载变形的问题，通过修改echart-all.js文件内_getTransform函数实现地图不变形。同时介绍了在Echarts2中如何添加自定义GeoJSON地图，通过在 echarts-all.js 中插入代码，实现了使用'hainan'作为地图类型。此外，还提及Echart3加载GeoJSON的便利性。

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