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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
| import getMax from "./tools/getMax";
| import getMin from "./tools/getMin";
|
| const getNormalBar = (data)=>{
| const defaultOption = {
| minRatio: 0,
| maxRatio: 1.1,
| grid: {
| top: '15%',
| right: '3%',
| left: '10%',
| bottom: '12%'
| },
| min: 0,
| max: 0,
| maxColor: "#FF0000",
| minColor: "#35f10a",
| normalColor: "rgb(24, 166, 253)"
| };
| let option = {...defaultOption, ...data};
| return {
| option,
| tooltip: {
| trigger: 'axis',
| axisPointer: {
| type: 'shadow'
| }
| },
| grid: option.grid,
| xAxis: {
| type: 'category',
| axisLine: {
| lineStyle: {
| color: 'rgba(255,255,255,0.12)'
| }
| },
| axisLabel: {
| color: '#e2e9ff',
| fontSize: 14
| },
| },
| yAxis: {
| type: 'value',
| min(data) {
| const min =data.min;
| if(isNaN(min)) {
| return 0;
| }else {
| return (min * option.minRatio).toHold(3);
| }
| },
| max(data) {
| const max = data.max;
| if(isNaN(max)) {
| return 1;
| }else {
| return (max * option.maxRatio).toHold(3);
| }
| },
| 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)'
| }
| }
| },
| title: {
| show: true,
| text: "最大值=0;最小值=0;平均值=0",
| x: "center",
| textStyle: {
| color: "#FFFFFF",
| fontSize: "14",
| },
| },
| series: [
| {
| name: "",
| data: [],
| type: 'bar',
| showBackground: true,
| symbolSize: 0,
| backgroundStyle: {
| color: 'rgba(180, 180, 180, 0.2)'
| },
| itemStyle: {
| color(cData) {
| if(option.max === Number(cData.data[1])) {
| return option.maxColor;
| }else if(option.min === Number(cData.data[1])) {
| return option.minColor;
| }else {
| return option.normalColor;
| }
| }
| },
| label: {
| show: true,
| position: "top",
| color: "#FFFFFF"
| }
| }
| ],
| }
| }
|
| export default getNormalBar;
|
|
