色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

echarts折線 json

錢艷冰2年前9瀏覽0評論

ECharts是一款開源的可視化庫,提供了多種圖表類型,如折線圖、柱狀圖、餅圖等。本文主要介紹ECharts中的折線圖,并使用JSON格式的數據進行繪制。

首先,ECharts的環境準備需要引入echarts.js文件,代碼示例如下:

接著,可以使用以下代碼創建一個DOM容器,準備放置折線圖:

然后,為了創建一條折線,需要利用JSON格式的數據進行配置。下面是一個包含兩個系列的數據示例。

var option = {
title: {
text: '折線圖示例'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:['系列1','系列2']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['1','2','3','4','5','6','7']
},
yAxis: {
type: 'value'
},
series: [
{
name:'系列1',
type:'line',
stack: '總量',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'系列2',
type:'line',
stack: '總量',
data:[220, 182, 191, 234, 290, 330, 310]
}
]
};

最后,利用ECharts的API,將DOM容器和數據選項進行配置和繪制:

var myChart = echarts.init(document.getElementById('main'));
myChart.setOption(option);

以上是利用JSON格式數據進行ECharts折線圖繪制的基本方法,使用靈活,能夠快速展示數據。