Echarts 可以繪製中國、各省及世界地圖,包括二維地圖和三維地圖,下面就如何生成地圖做概要介紹。
1 地圖功能概述
Echarts 中,如果需要將區域數據可視化,使用 series 中的地圖組件,如果需要在地圖中標註地理位置信息,就要使用geo,即地理座標系組件。
在二維地圖中,series 中的地圖組件,配合visualMap 組件可用於展示不同區域的人口、經濟發展、能源分佈等數據,可採用不同顏色將數據大小分級,配合圖例將區域數據可視化。地理座標系組件則支持在地圖上標註地理座標,並在地理座標系上繪製散點圖,線集。
Echarts還支持同時使用series 中的地圖組件和地理座標系組件,這時地圖組件可採用geo組件中的數據,並控制geo區域的顏色。這就實現了在地圖中同時展現區域數據和地理位置信息。
三維地圖中,同樣區分區域數據和地理位置信息數據展示,series中的map3D組件用於展示區域數據,geo3D用於展示地理位置信息。相比於二維的地圖,三維地圖首先實現了立體化,其次還能對每個區域設置不同的高度,這個高度能夠用來展示數據大小。
2 引入包方法
二維地圖需只需要引入echarts.min.js, 三維地圖則需要在引入echarts.min.js
的基礎上再引入一個echarts-gl.min.js。
多頁面中,標籤引入:
<script src="lib/echarts.min.js"></script>
<script src="lib/echarts-gl.min.js"></script>
單頁面中,如果使用webpack等打包,