echarts堆叠柱状图横向
时间: 2023-11-12 21:00:34 浏览: 136
您可以使用 echarts 中的柱状图(bar)和堆叠(stack)属性来实现横向的堆叠柱状图。具体实现步骤如下:
1. 在 option 中设置 xAxis 和 yAxis 的 type 为 value,同时设置 xAxis 的 position 为 top,yAxis 的 position 为 left,这样就可以实现横向的柱状图。
2. 在 series 中设置 type 为 bar,同时设置 stack 属性为堆叠的组名,这样就可以实现堆叠柱状图。
3. 如果需要设置柱状图的颜色,可以在 series 中设置 itemStyle.normal.color 属性。
下面是一个简单的示例代码:
```
option = {
xAxis: {
type: 'value',
position: 'top'
},
yAxis: {
type: 'category',
data: ['A', 'B', 'C']
},
series: [
{
name: 'Series 1',
type: 'bar',
stack: 'Stack 1',
itemStyle: {
normal: {
color: '#FFA07A'
}
},
data: [10, 20, 30]
},
{
name: 'Series 2',
type: 'bar',
stack: 'Stack 1',
itemStyle: {
normal: {
color: '#87CEFA'
}
},
data: [20, 30, 40]
}
]
};
```
阅读全文