设置echarts柱状图颜色
时间: 2023-11-07 07:06:16 浏览: 87
基于echarts 3.8.4,tree图中,连线的颜色,可每条线独立设置
4星 · 用户满意度95%
在ECharts中,可以通过设置itemStyle的color属性来设置柱状图的颜色。你可以使用颜色值或者渐变色来设置柱状图的颜色。以下是两种设置颜色的方法:
方法一:使用颜色值
在series中的itemStyle中,使用normal属性来设置柱状图的颜色。例如,你可以设置颜色值为'#FFA100':
```javascript
itemStyle: {
normal: {
color: '#FFA100'
}
}
```
方法二:使用渐变色
在series中的itemStyle中,使用normal属性来设置柱状图的颜色,并使用echarts.graphic.LinearGradient来定义渐变色。例如,你可以设置从'#248ff7'到'rgba(22,75,247,0.1)'的渐变色:
```javascript
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#248ff7' },
{ offset: 1, color: 'rgba(22,75,247,0.1)' }
])
}
}
```
除了柱状图,以上两种设置颜色的方法也适用于折线图、圆形图等其他类型的图表。
阅读全文