echarts图每个柱子对应一个图例
时间: 2023-10-19 09:52:15 浏览: 118
您好!对于一个 ECharts 图表中的柱状图,您可以通过设置每个柱子的 name 属性来对应一个图例。下面是一个示例代码:
```javascript
option = {
// ... 其他配置项
legend: {
data: ['图例1', '图例2', '图例3'] // 设置图例的名称
},
xAxis: {
type: 'category',
data: ['柱子1', '柱子2', '柱子3'] // 设置 x 轴的数据
},
yAxis: {
type: 'value'
},
series: [
{
name: '图例1', // 对应第一个柱子的图例名称
type: 'bar',
data: [100, 200, 300] // 第一个柱子的数据
},
{
name: '图例2', // 对应第二个柱子的图例名称
type: 'bar',
data: [150, 250, 350] // 第二个柱子的数据
},
{
name: '图例3', // 对应第三个柱子的图例名称
type: 'bar',
data: [120, 220, 320] // 第三个柱子的数据
}
]
};
```
在上面的代码中,通过设置 `legend` 属性中的 `data` 数组来指定图例的名称,然后在 `series` 中分别设置每个柱子的 `name` 属性与对应的图例名称相对应。
希望能对您有所帮助!如果还有其他问题,请随时提问。
阅读全文