配置项如下
option = {
backgroundColor: '#fff',
grid: {
top: '100',
right: '40',
left: '60',
bottom: '40' //图表尺寸大小
},
xAxis: [{
type: 'category',
color: '#59588D',
data: [0.0,
2.0,
4.0,
6.0,
8.0,
10.0,
12.0,
14.0,
16.0,
18.0,
20.0,
22.0,
24.0,
26.0,
28.0,
30.0,
32.0,
34.0,
36.0,
38.0,
40.0,
42.0,
44.0,
46.0,
48.0,
50.0,
52.0,
54.0,
56.0,
58.0,
60.0,
62.0,
64.0,
66.0,
68.0,
70.0,
72.0,
74.0,
76.0,
78.0,
80.0,
82.0,
84.0,
86.0,
88.0,
90.0,
92.0,
94.0,
96.0,
98.0,
100.0],
axisLabel: {
margin: 10,
color: '#999',
textStyle: {
fontSize: 12
},
},
axisLine: {
lineStyle: {
color: 'rgba(107,107,107,0.37)',
}
},
axisTick: {
show: false
},
}],
yAxis: [{
axisLabel: {
formatter: '{value}',
color: '#999',
textStyle: {
fontSize: 12
},
},
axisLine: {
lineStyle: {
color: 'rgba(107,107,107,0.37)',
}
},
axisTick: {
show: false
},
splitLine: {
lineStyle: {
color: 'rgba(131,101,101,0.2)',
type: 'dashed',
}
}
}],
series: [{
type: 'bar',
data: [30532,
70147,
57583,
55007,
53857,
57046,
56739,
56974,
61272,
65497,
64598,
63290,
67763,
62134,
64371,
56718,
57755,
59442,
56420,
60031,
59601,
59024,
63450,
65879,
74118,
89225,
86976,
87309,
92435,
93884,
93292,
95020,
95482,
96445,
101132,
102074,
102118,
103292,
103946,
98990,
98278,
109784,
108255,
125681,
152286,
186320,
386361,
528224,
1204885,
1669029,
162739],
barWidth: '16px',
itemStyle: {
normal: {
color: function(params) { //展示正值的柱子,负数设为透明
let colorArr = params.value > 0 ? ['#FF9A22', '#FFD56E'] : ['rgba(0,0,0,0)', 'rgba(0,0,0,0)']
return new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: colorArr[0] // 0% 处的颜色
}, {
offset: 1,
color: colorArr[1] // 100% 处的颜色
}], false)
},
barBorderRadius: [30, 30, 0, 0] //圆角大小
},
}
}, {
data: [30532,
70147,
57583,
55007,
53857,
57046,
56739,
56974,
61272,
65497,
64598,
63290,
67763,
62134,
64371,
56718,
57755,
59442,
56420,
60031,
59601,
59024,
63450,
65879,
74118,
89225,
86976,
87309,
92435,
93884,
93292,
95020,
95482,
96445,
101132,
102074,
102118,
103292,
103946,
98990,
98278,
109784,
108255,
125681,
152286,
186320,
386361,
528224,
1204885,
1669029,
162739],
type: 'line',
smooth: true,
name: '折线图',
symbol: 'none',
lineStyle: {
color: '#3275FB',
width: 3,
shadowColor: 'rgba(0, 0, 0, 0.3)', //设置折线阴影
shadowBlur: 15,
shadowOffsetY: 20,
}
}]
};