ansel0926
2022-05-14 cc021a0544a8c0b2a056cec3168da119515a8e38
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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
columnTemplate2 = {
    title:{
        text:"输入标题",
        textStyle:{
            color:'#fff',
            fontStyle:'normal',
            fontWeight:'bold',
            fontFamily:'sans-serif',
         fontSize:12
        }
    },
    textStyle:{
        fontFamily: "Microsoft YaHei",
        fontSize: 9,
        fontStyle: "normal",
        fontWeight: "normal",
        color: '#fff'
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        }
    },
    legend: {
        data: ['系列1', '系列2'],
        bottom:0,
        textStyle: {
            color: "#fff",
            fontSize:9
        },
        itemWidth: 10,
        itemHeight: 10,
        itemGap: 35
    },
    grid: {
        top:40,
        left:10,
        bottom:20,
        right:10,
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        data: ['类别1',
            '类别2',
        ],
        axisLine: {
            show: true,
            lineStyle: {
                color: "#063374",
                width: 1,
                type: "solid"
            }
        },
        axisTick: {
            show: false,
        },
        axisLabel: {
            show: true,
            fontSize:9,
            margin:5,
            color: "#fff",
        },
    }],
    yAxis: [{
        name:'单位:',
        nameTextStyle:{
            color:"#fff",
            fontSize:9,
            padding:[0, 30, -10, 0]
        },
        type: 'value',
        axisLabel: {
            formatter: '{value} %'
        },
        axisTick: {
            show: false,
        },
        axisLine: {
            show: false,
            lineStyle: {
                color: "#fff",
                width: 1,
                type: "solid"
            },
        },
        axisLabel:{
            fontSize:9,
            margin:5
        },
        splitLine: {
            lineStyle: {
                color: "#063374",
            }
        }
    }],
    series: [{
        name: '系列1',
        type: 'bar',
        data: [20, 50],
        barWidth: 10, //柱子宽度
        barGap: 1, //柱子之间间距
        itemStyle: {
            color:'#008cff',
            // normal: {
            //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            //         offset: 0,
            //         color: '#008cff'
            //     }, {
            //         offset: 1,
            //         color: '#005193'
            //     }]),
            //     opacity: 1,
            // }
        }
    }, {
        name: '系列2',
        type: 'bar',
        data: [50, 70],
        barWidth: 10,
        barGap: 1,
        itemStyle: {
            color:'#00da9c',
            // normal: {
            //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            //         offset: 0,
            //         color: '#00da9c'
            //     }, {
            //         offset: 1,
            //         color: '#007a55'
            //     }]),
            //     opacity: 1,
            // }
        }
    },]
};
 
columnTemplate2Series=[{
    name: '',
    type: 'bar',
    data: [],
    barWidth: 10, //柱子宽度
    barGap: 1, //柱子之间间距
    itemStyle: {
        color:'#008cff',
        // normal: {
        //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         color: '#008cff'
        //     }, {
        //         offset: 1,
        //         color: '#005193'
        //     }]),
        //     opacity: 1,
        // }
    }
}, {
    name: '',
    type: 'bar',
    data: [],
    barWidth: 10,
    barGap: 1,
    itemStyle: {
        color:'#00da9c'
        // normal: {
        //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         color: '#00da9c'
        //     }, {
        //         offset: 1,
        //         color: '#007a55'
        //     }]),
        //     opacity: 1,
        // }
    }
}]