no message

src/views/Map3d/Map3DMain.vue

@@ -50,7 +50,9 @@
 	import ggsbtj from "./components/ggsbtj.vue";
 	import ysltj from "./components/ysltj.vue";
 	import sbyxjc from "./components/sbyxjc.vue";
-	import qtnhzb from "./components/qtnhzb.vue"
+	import qtnhzb from "./components/qtnhzb.vue";
+	import nhtbtj from "./components/nhtbtj.vue";
+	import znjk from "./components/znjk.vue";
 	import {
 		provide
 	} from "vue";

src/views/Map3d/components/nhtbtj.vue

@@ -1,6 +1,6 @@
 <template>
 	<div>
-		<div id="echarts" style="width:400px;height:200px;margin:50px auto;"></div>
+		<div id="echarts"></div>
 	</div>
 </template>
 
@@ -10,101 +10,103 @@
 	export default {
 		data() {
 			return {
-				
+
 			}
 		},
-		created() { },
+		created() {},
 		mounted() {
 			this.typeCharts0()
 		},
 		methods: {
 
-		typeCharts0() {
-					let option = this.getOption();
-					var chartDom = document.getElementById('echarts');
-					var myChart = echarts.init(chartDom);
-					myChart.setOption(option, true);
-				},
-				getOption(data) {
-					let option = {
-						color: ["#2B80FF", "#3DF3C4"],
-						title: {
-							text: ''
-						},
-						tooltip: {
-							trigger: 'axis'
+			typeCharts0() {
+				let option = this.getOption();
+				var chartDom = document.getElementById('echarts');
+				var myChart = echarts.init(chartDom);
+				myChart.setOption(option, true);
+			},
+			getOption(data) {
+				let option = {
+					color: ["#2B80FF", "#3DF3C4"],
+					title: {
+						text: ''
+					},
+					tooltip: {
+						trigger: 'axis'
+					},
+					legend: {
+						orient: 'horizontal',
+						x: 'center',
+						y: 'top',
+						textStyle: {
+							fontSize: 12,
 						},
-						legend: {
-							orient: 'horizontal',
-							x: 'center',
-							y: 'top',
-							textStyle: {
-								fontSize: 12,
+						data: [{
+								name: '上月(kw/h)',
+								textStyle: {
+									color: "#2B80FF "
+								}
 							},
-							data: [
-								{
-									name: '上月(kw/h)',
-									textStyle: {
-										color: "#2B80FF "
-									}
-								},
-								{
-									name: '本月(kw/h)',
-									textStyle: {
-										color: "#3DF3C4"
-									}
+							{
+								name: '本月(kw/h)',
+								textStyle: {
+									color: "#3DF3C4"
 								}
-							],
-							backgroundColor: 'rgba(0,0,0,0)',
-							borderColor: '#ccc',
-							borderWidth: 0,
-							padding: 5,
-							itemGap: 10,
-							itemWidth: 20,
-							itemHeight: 14,
-						},
-						grid: {
-							left: '3%',
-							right: '4%',
-							bottom: '3%',
-							containLabel: true
-						},
-						toolbox: {
-							feature: {
-								saveAsImage: {}
 							}
+						],
+						backgroundColor: 'rgba(0,0,0,0)',
+						borderColor: '#ccc',
+						borderWidth: 0,
+						padding: 5,
+						itemGap: 10,
+						itemWidth: 20,
+						itemHeight: 14,
+					},
+					grid: {
+						left: '3%',
+						right: '4%',
+						bottom: '3%',
+						containLabel: true
+					},
+					// toolbox: {
+					// 	feature: {
+					// 		saveAsImage: {}
+					// 	}
+					// },
+					xAxis: {
+						type: 'category',
+						boundaryGap: false,
+						data: ['一月', '二月', '三月', '四月', '五月', '六月']
+					},
+					yAxis: {
+						type: 'value'
+					},
+					series: [{
+							name: '上月(kw/h)',
+							type: 'line',
+							stack: 'Total',
+							data: [1000, 1500, 1300, 1700, 1600, 1200]
 						},
-						xAxis: {
-							type: 'category',
-							boundaryGap: false,
-							data: ['一月', '二月', '三月', '四月', '五月', '六月']
+						{
+							name: '本月(kw/h)',
+							type: 'line',
+							stack: 'Total',
+							data: [1200, 1800, 1400, 1350, 1100, 1500]
 						},
-						yAxis: {
-							type: 'value'
-						},
-						series: [
-							{
-								name: '上月(kw/h)',
-								type: 'line',
-								stack: 'Total',
-								data: [1000, 1500, 1300, 1700, 1600, 1200]
-							},
-							{
-								name: '本月(kw/h)',
-								type: 'line',
-								stack: 'Total',
-								data: [1200, 1800, 1400, 1350, 1100, 1500]
-							},
-						]
-					};
-					return option;
-				}
-		
+					]
+				};
+				return option;
+			}
+
 		},
 
 	}
 </script>
 
-<style>
-
-</style>
+<style scoped>
+	#echarts {
+		width: 320rem;
+		height: 200rem;
+		margin: 10rem;
+	}
+</style>

src/views/Map3d/components/qtnhzb.vue

@@ -130,22 +130,22 @@
 				categories.push(axisData);
 				categories2.shift();
 				categories2.push(app.count++);
-				myChart.setOption({
-					xAxis: [{
-							data: categories
-						},
-						{
-							data: categories2
-						}
-					],
-					series: [{
-							data: data
-						},
-						{
-							data: data2
-						}
-					]
-				});
+				// myChart.setOption({
+				// 	xAxis: [{
+				// 			data: categories
+				// 		},
+				// 		{
+				// 			data: categories2
+				// 		}
+				// 	],
+				// 	series: [{
+				// 			data: data
+				// 		},
+				// 		{
+				// 			data: data2
+				// 		}
+				// 	]
+				// });
 			}, 2100);
 		}
 	}