1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
| import * as echarts from "echarts";
|
| const getRadiusBarOption = (data)=>{
| const defaultOption = {
| minRatio: 0,
| maxRatio: 1.2,
| grid: {
| top: '15%',
| right: '3%',
| left: '10%',
| bottom: '12%'
| },
| };
| const option = {...defaultOption, ...data};
| return {
| tooltip: {
| trigger: 'axis',
| axisPointer: {
| type: 'shadow'
| }
| },
| grid: option.grid,
| xAxis: [{
| type: 'category',
| axisLine: {
| lineStyle: {
| color: 'rgba(255,255,255,0.12)'
| }
| },
| axisLabel: {
| interval: 0,
| margin: 10,
| color: '#e2e9ff',
| textStyle: {
| fontSize: 14
| },
| },
| }],
| yAxis: [{
| min(data) {
| const min =data.min;
| if(isNaN(min)) {
| return 0;
| }else {
| return min * option.minRatio;
| }
| },
| max(data) {
| const max = data.max;
| if(isNaN(max)) {
| return 1;
| }else {
| return (max * option.maxRatio).toHold(0);
| }
| },
| axisLabel: {
| formatter: '{value}',
| color: '#e2e9ff',
| },
| axisLine: {
| show: true,
| lineStyle: {
| color: 'rgba(255,255,255,0.12)'
| }
| },
| splitLine: {
| lineStyle: {
| color: 'rgba(255,255,255,0.12)'
| }
| }
| }],
| series: [{
| type: 'bar',
| // data: [["2021",100]],
| data: [],
| barWidth: '20px',
| itemStyle: {
| normal: {
| color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
| offset: 0,
| color: 'rgba(0,244,255,1)' // 0% 处的颜色
| }, {
| offset: 1,
| color: 'rgba(0,77,167,1)' // 100% 处的颜色
| }], false),
| barBorderRadius: [30, 30, 0, 0],
| shadowColor: 'rgba(0,160,221,1)',
| shadowBlur: 4,
| }
| },
| label: {
| normal: {
| show: true,
| position: "top",
| color: "#FFFFFF"
| }
| }
| }]
| }
| }
|
| export default getRadiusBarOption;
|
|
