1. 程式人生 > >Echarts地圖使用經驗-地圖變形和添加數據

Echarts地圖使用經驗-地圖變形和添加數據

img height pty -c 方便 get 一點 function https

關於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地圖使用經驗-地圖變形和添加數據