echarts柱状图设置图例颜色
时间: 2023-09-27 10:07:51 浏览: 116
要设置ECharts柱状图的图例颜色,可以使用legend配置项中的textStyle属性来设置。以下是一个示例代码:
```javascript
option = {
...
legend: {
data: ['柱状图1', '柱状图2', '柱状图3'], // 图例数据
textStyle: {
color: 'red' // 图例文字颜色
},
...
},
...
series: [
{
name: '柱状图1', // 柱状图1的名称
type: 'bar',
data: [10, 20, 30], // 柱状图1的数据
itemStyle: {
color: 'blue' // 柱状图1的颜色
}
},
{
name: '柱状图2', // 柱状图2的名称
type: 'bar',
data: [15, 25, 35], // 柱状图2的数据
itemStyle: {
color: 'green' // 柱状图2的颜色
}
},
{
name: '柱状图3', // 柱状图3的名称
type: 'bar',
data: [20, 30, 40], // 柱状图3的数据
itemStyle: {
color: 'yellow' // 柱状图3的颜色
}
}
]
};
```
在上面的代码中,legend配置项中的textStyle属性用于设置图例文字的样式,可以通过color属性设置文字颜色。series数组中的每个对象都代表一个柱状图,可以使用itemStyle属性来设置柱状图的样式,包括颜色。通过这样的配置,就可以自定义柱状图的图例颜色了。
注意:以上代码只是一个简单示例,实际使用时需根据自己的数据和需求进行相应的配置。
阅读全文