柱状图颜色渐变

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
import echarts from 'echarts'
...
series: [
{
type: 'bar',
// 图形样式
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#178ffc' },
{ offset: 1, color: '#ffffff' },
]),
},
emphasis: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: '#178ffc'},
{offset: 1, color: '#ffffff'}
])
}
},
],

横坐标值显示不全(自动隐藏)

echarts中,横轴数据如果非常多,会自动隐藏一部分数据,我们可以通过属性 interval 来进行调整。

1
2
3
4
5
6
7
xAxis: {
type: 'category',
data: labels,
axisLabel: {
interval: 0,
},
},