Bladeren bron

柱状图

Administrator 2 jaren geleden
bovenliggende
commit
898c2d1392
2 gewijzigde bestanden met toevoegingen van 22 en 20 verwijderingen
  1. 19 5
      src/views/Map3d/components/waterChart.vue
  2. 3 15
      src/views/Map3d/components/ysltj.vue

+ 19 - 5
src/views/Map3d/components/waterChart.vue

@@ -8,9 +8,9 @@
 	export default {
 		data() {
 			return {
-				xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-				yData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-				taskDate: [10, 11, 9, 17, 14, 13, 14],
+				xData: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], //横坐标
+				yData: [23, 24, 18, 25, 27, 28, 25, 26, 25, 18, 19, 23], //人数数据
+				taskDate: [10, 11, 9, 17, 14, 13, 14, 15, 14, 11, 14, 16],
 				myChartStyle: {
 					float: "left",
 					width: "100%",
@@ -31,13 +31,27 @@
 					// 图例
 					legend: {
 						data: ["人数", "任务数"],
-						top: "5%",
+						top: "0%",
 						textStyle: {
 							color: '#ffffff' //字体颜色
 						},
 
 					},
-					yAxis: {},
+					yAxis: {
+						axisLabel: {
+							formatter: "{value}",
+							color: "#e2e9ff",
+						},
+						axisLine: {
+							show: false,
+						},
+						splitLine: {
+							lineStyle: {
+								color: "rgba(255,255,255,0.12)",
+							},
+						},
+
+					},
 					series: [{
 							type: "bar", //形状为柱状图
 							data: this.yData,

+ 3 - 15
src/views/Map3d/components/ysltj.vue

@@ -37,19 +37,7 @@
 			}
 		},
 		methods: {
-			 setData() {
-			      this.cdata.xData = [
-			        "工作票",
-			        "操作票",
-			        "抢修",
-			        "用电调查",
-			        "设备巡视",
-			        "现场勘查",
-			        "到岗到位",
-			      ];
-			 
-			      this.cdata.yData = [300, 450, 770, 203, 255, 188, 156];
-			    },
+		
 			  },
 	
 			getName() {
@@ -58,7 +46,7 @@
 
 
 		mounted() {
-			this.setData();
+
 		}
 	}
 </script>
@@ -76,7 +64,7 @@
 		margin-left: 40rem;
 	}
 
-	::-webkit-scrollbar {
+	.middle::-webkit-scrollbar {
 		width: 0rem;
 		height: 0rem;
 	}