Echarts地圖繪製（散點，色卡）
echarts繪製地圖時，提供了js內部註冊，也提供了json資料手動註冊，這兩種都可以繪製對應地圖，但有一點不同的是，js內部只註冊了中國地圖和世界地圖，而json資料提供了世界，中國，中國城市的資料
手動註冊：引入json資料，使用 echarts.registerMap('china', chinaJSON);就可以繪製中國地圖了
由於echarts提供的geoJSON資料過少，當我們想繪製中國城市甚至是城市的每個區的時候，我們就需要自定義geoJSON資料
提供geoJSON資料的網站：
該網站提供了中國省，市，縣，地區的geoJSON資料，這樣我們就可以自定義繪製對應地圖了
散點
繪製地圖完成後，可以在上面設定散點圖，根據echarts的配置進行設定
backgroundColor=“#ccc” // 地圖的背景顏色
geo = { // 地圖相關配置
map: “china” , // “china”是註冊地圖時使用的名稱
roam: true, // 地圖是否可以縮放
itemStyle: { // 地圖區域的配置
normal: {
areaColor: '#323c48', // 繪製的每一個輪廓的背景顏色
borderColor: '#111'
},
emphasis: {
areaColor: '#2a333d'，// 滑鼠移到區域時的背景顏色
},
}
... // 更多配置可以檢視官網
};
visualMap = { // 視覺對映配置
show: true, // 顏色漸變條是否顯示
color: ["", "", ""], // 漸變的顏色集合
textStyle: { // 地圖上的樣式，比如，字型顏色，大小
color: #fff,
},
}；
series = [{
type: "scatter" , // 型別為散點圖
coordinateSystem: 'geo', // 使用該座標系，對映到地圖上
data: [[121.221, 23.43, 12]], //散點的資料
symbolSize: 5, // 散點的大小
}];
色卡
繪製地圖完成後，可以在上面根據繪製的區域進行著色，根據echarts的配置進行設定
background='#ccc'; // 地圖背景顏色
visualMap={
type: 'continuous', // 顏色漸變條為連續還是分段 （continuous 或 piecewise）
min: 0, // 漸變的最小值
max: 100, // 漸變的最大值
show: true, // 是否展示漸變條
inRange: { // 漸變顏色範圍
color: ['#00FA9A', '#00FF7F', '#7FFF00' ],
},
textStyle: { // 地圖上的樣式
color: '#fff',
};
series=[{
type: 'map'， // 型別為地圖
map: 'china', // 該值為註冊地圖時的名稱
roam: true, // 允許地圖縮放
data: [{ name: '北京', value: 10 }], // 每一個數據的name與註冊地圖的geoJSON裡的name對應，不然對映不了
itemStyle: { // 地圖區域的配置
normal: {
areaColor: '#323c48', // 繪製的每一個輪廓的背景顏色
borderColor: '#111'
},
emphasis: {
areaColor: '#2a333d'，// 滑鼠移到區域時的背景顏色
},
}];
更多配置請檢視echarts官網： http://www.echartsjs.com/index.html