echarts是一個(gè)基于JavaScript的可視化庫(kù),它支持多種圖表類(lèi)型,其中地圖是非常常見(jiàn)的一種。在echarts中,我們通過(guò)傳入json格式的數(shù)據(jù)來(lái)展示地圖上的各種元素,比如區(qū)域的顏色,標(biāo)記點(diǎn)的位置和大小等等。
下面是一個(gè)基本的地圖數(shù)據(jù)的json格式:
{
"title": {
"text": "全國(guó)主要城市空氣質(zhì)量",
"subtext": "data from PM25.in",
"sublink": "http://www.pm25.in",
"left": "center"
},
"tooltip": {
"trigger": "item"
},
"legend": {
"orient": "vertical",
"left": "left",
"data":[
"AQI< 50", "AQI< 100", "AQI< 150", "AQI< 200", "AQI >= 200"
]
},
"visualMap": {
"min": 0,
"max": 300,
"left": "left",
"top": "bottom",
"text": ["High", "Low"],
"calculable": true
},
"geo": {
"map": "china",
"label": {
"emphasis": {
"show": true,
"color": "#ffffff"
}
},
"roam": true,
"itemStyle": {
"normal": {
"areaColor": "#dddddd",
"borderColor": "#ffffff"
},
"emphasis": {
"areaColor": "#cccccc"
}
}
},
"series": [
{
"name": "AQI",
"type": "heatmap",
"coordinateSystem": "geo",
"data": [
{
"name": "北京",
"value": 123
},
{
"name": "天津",
"value": 121
},
...
]
}
]
}
在這個(gè)例子中,我們可以看到整個(gè)json數(shù)據(jù)包含了一個(gè)標(biāo)題,一個(gè)提示框,一個(gè)圖例,一個(gè)視覺(jué)映射,一個(gè)地圖以及一個(gè)系列。
系列是我們最關(guān)心的部分,它包含了一個(gè)類(lèi)型、一個(gè)坐標(biāo)系、一個(gè)數(shù)據(jù)和一個(gè)名稱(chēng)等等。在這個(gè)例子中,我們使用了一個(gè)熱力圖作為系列,它的坐標(biāo)系是geo(地理坐標(biāo)系),數(shù)據(jù)是各個(gè)城市的空氣質(zhì)量指數(shù),在上面的json數(shù)據(jù)中通過(guò)數(shù)組來(lái)表示。
如果你想了解更多關(guān)于echarts地圖數(shù)據(jù)的json格式的細(xì)節(jié),可以參考echarts官方文檔。