uchart堆叠图合计

配置

opts: {
					dataLabel: true,
					color: ["#5263FF", "#D252FF", "#6AFF52", "#FFC130"],
					padding: [15, 15, 0, 5],
					// rotate: true,
					enableScroll: true, //开启图表拖拽功能
					scrollAlign: 'left', //图表滚动条起始位置
					legend: {
						position: 'top',
						float: 'right',
						show: false
					},
					onzoom: true,
					xAxis: {
						disableGrid: true,
						fontSize: 12,
						gridType: 'dash',
						itemCount: 5, //x轴单屏显示数据的数量，默认为5个
						scrollShow: true, //新增是否显示滚动条，默认false
						scrollAlign: 'left', //滚动条初始位置
					},
					yAxis: {
						data: [{
							min: 0
						}]
					},
					extra: {
						column: {
							type: "stack",
							width: 20,
							activeBgColor: "#000000",
							activeBgOpacity: 0.08,
						},
					}
				},
                                
                                let options = {
					categories: stageNameList,
					series: [{
							name: "500kV及以上",
							textColor: "#0000",
							data: moreThenfiveProjectNumList,
							label: {
								normal: {
									show: false,
									position: 'top',
									color: '#ffffff2a'
								}
							},
						},
						{
							name: "220kV",
							textColor: "#0000",
							data: twoProjectNumList,
							label: {
								normal: {
									show: false,
									position: 'top',
									color: '#ffffff2a'
								}
							},

						},
						{
							name: "110kV及以下",
							textColor: "#0000",
							data: oneprojectNumList,
							label: {
								normal: {
									show: false,
									position: 'top',
									color: '#ffffff2a'
								}
							},

						},
						{
							name: '总计',
							type: 'bar',
							stack: 'y', //注意与前面的stack属性不同！！！！
							data: numArr, //为前面对应数据的总和
							label: {
								normal: {
									show: true,
									position: 'top',
									color: '#000'
								}
							},
							barGap: '-100%', //与堆叠柱条重合
						}
					]
				};
				this.chartData = options;

这篇好文章是转载于：学新通技术网