echart 面积图 画到坐标轴右侧
时间: 2024-05-11 07:13:16 浏览: 130
Echart画图
ECharts 是一个非常流行的基于 JavaScript 的可视化库,它可以用来制作各种各样的图表,包括面积图。如果你想把 ECharts 面积图画到坐标轴右侧,可以通过以下步骤实现:
1. 设置图表的 grid 属性的 right 值为 '20%',使得坐标轴向左移动一些。
2. 设置每个系列的 areaStyle.normal.origin 属性为 'end',表示面积从数据点的末尾开始。
3. 设置 yAxis.axisLine.onZero 属性为 false,将坐标轴线移到右侧。
4. 在 yAxis 的属性中设置 inverse 为 true,使得 y 轴翻转并放到右侧。
以下是一个示例代码:
```
option = {
grid: {
right: '20%'
},
xAxis: {
type: 'category',
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
},
yAxis: {
type: 'value',
axisLine: {
onZero: false
},
inverse: true
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'line',
areaStyle: {
normal: {
origin: 'end'
}
}
}]
};
```
阅读全文