Echarts是一款開源的、基于JavaScript的數據可視化庫,它提供了許多數據可視化的類型,其中包括了餅圖。在使用Echarts繪制餅圖時,我們需要用到json數據。下面我們通過一個例子來學習Echarts餅圖的json數據格式。
{
"title": {
"text": "各個省份人口分布",
"subtext": "2019年",
"x": "center"
},
"tooltip": {
"trigger": "item",
"formatter": "{a}
: {c} (y2owqmc%)"
},
"legend": {
"orient": "vertical",
"left": "left",
"data": ["北京", "上海", "廣東", "江蘇", "浙江"]
},
"series": [{
"name": "省份",
"type": "pie",
"radius": "55%",
"center": ["50%", "60%"],
"data": [
{"value": 8260, "name": "北京"},
{"value": 9450, "name": "上海"},
{"value": 18600, "name": "廣東"},
{"value": 12000, "name": "江蘇"},
{"value": 8700, "name": "浙江"}
],
"itemStyle": {
"emphasis": {
"shadowBlur": 10,
"shadowOffsetX": 0,
"shadowColor": "rgba(0, 0, 0, 0.5)"
}
}
}]
}
上面是一個簡單的餅圖json數據格式的例子,下面我們逐個講解其中的每個屬性。
- title:標題,可設置主標題和副標題,其中text表示主標題,subtext表示副標題,x表示標題位置,可設置為left、center、right。
- tooltip:提示框組件,包含觸發類型和提示框格式設置。如例子中設置了鼠標放在餅圖上時觸發,顯示省份和人口數。
- legend:圖例組件,表示餅圖中每個扇形的標簽,可設置方向、位置和標簽內容。如例子中設置了圖例在左側,標簽內容為各省份名稱。
- series:系列,包含數據源及數據項的樣式設置。如例子中設置了餅圖類型、半徑、中心、數據源及高亮樣式。
上述例子是一個簡單的Echarts餅圖json數據格式,更多的屬性和設置可以參考Echarts官方文檔,希望此篇文章對你有所幫助。