echarts的平滑折线图怎么添加多条
时间: 2023-11-03 09:56:34 浏览: 71
Echarts动态加载多条折线图的实现代码
5星 · 资源好评率100%
要添加多条平滑折线图,你可以按照以下步骤:
1. 首先创建一个 echarts 实例:
```javascript
var myChart = echarts.init(document.getElementById('myChart'));
```
2. 定义一个 option 对象,包含多个 series 对象,每个 series 对象代表一条平滑折线图。可以像下面这样定义:
```javascript
var option = {
title: {
text: '平滑折线图'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['图例1', '图例2', '图例3']
},
xAxis: {
type: 'category',
data: ['一月', '二月', '三月', '四月', '五月', '六月']
},
yAxis: {
type: 'value'
},
series: [{
name: '图例1',
type: 'line',
smooth: true,
data: [10, 12, 21, 54, 260, 830]
}, {
name: '图例2',
type: 'line',
smooth: true,
data: [30, 182, 434, 791, 390, 30]
}, {
name: '图例3',
type: 'line',
smooth: true,
data: [1320, 1132, 601, 234, 120, 90]
}]
};
```
3. 调用 setOption 方法将 option 对象设置给 echarts 实例:
```javascript
myChart.setOption(option);
```
以上就是添加多条平滑折线图的基本步骤,你可以根据自己的需求修改 option 对象中的属性。
阅读全文