echarts繪製3D城市地圖

使用echarts 繪製 中國地圖/各省地圖/市級地圖 的3D地圖

先上效果圖

中國

四川省

成都市

dome代碼地址 https://github.com/zhaosheng808/echarts-demo

3D地圖說明

經過使用 series-map3D 能夠繪製3D地圖

快速開始

1.須要先下載echarts.js,而後額外下載 echarts-gl.js,並在頁面中引入

<script type="text/javascript" src="./lib/echarts/echarts-4.9.0/echarts.min.js"></script>
<script type="text/javascript" src="./lib/echarts/echarts-gl.min.js"></script>

這個兩個js文件能夠在echarts官網下載也能夠在上面給的dome項目中拷貝
echarts資源下載
echarts擴展下載

2.經過json導入地圖數據

$.get('map/json/china.json', function (chinaJson) {
   echarts.registerMap('china', chinaJson); // 註冊地圖
   var chart = echarts.init(document.getElementById('main'));
   chart.setOption({ 
      series: [{ 
          type: 'map3D', // map、map3D
          map: 'china' // 註冊的地圖名稱
      }] 
   });
});

中國地圖/各省地圖/市級地圖
使用方式相同 惟一的區別是導入不一樣的 json 文件

demo項目中附帶china.json以及各級省市json文件
/map/目錄下有中國地圖以及 各省市的 地圖 json文件 /map/geoCitys.js是省市關聯文件
level表明行政級別
code表明城市編碼

地圖數據json文件可能不許確 能夠自行下載替換
DATAV