echarts 柱状图加趋势线
时间: 2023-10-30 14:05:47 浏览: 70
可以使用Echarts的markLine来添加柱状图的趋势线。具体步骤如下:
1. 定义一个包含趋势线数据的数组,例如:
```javascript
var trendData = [
{ type: 'average', name: '平均值' },
{ yAxis: 100, name: '阈值' }
];
```
2. 在柱状图的series属性中添加markLine属性,并设置data为趋势线数据数组,例如:
```javascript
series: [
{
type: 'bar',
data: [120, 200, 150, 80, 70, 110, 130],
markLine: {
data: trendData
}
}
]
```
3. 完整示例代码如下:
```javascript
var trendData = [
{ type: 'average', name: '平均值' },
{ yAxis: 100, name: '阈值' }
];
option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [
{
type: 'bar',
data: [120, 200, 150, 80, 70, 110, 130],
markLine: {
data: trendData
}
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
```