完善星座图和载噪比视图布局

src/render/PlanispherePage.vue

@@ -3,16 +3,16 @@
     <TheHeader />
 
     <div class="main-content flex-1 grid grid-cols-2 grid-rows-2">
-      <div class="">
+      <div>
         <PlanisphereView title="北斗" />
       </div>
-      <div class="">
+      <div>
         <PlanisphereView title="GPS" />
       </div>
-      <div class="">
+      <div>
         <PlanisphereView title="格洛纳斯" />
       </div>
-      <div class="">
+      <div>
         <PlanisphereView title="伽利略" />
       </div>
     </div>

src/render/SNRPage.vue

@@ -2,18 +2,18 @@
   <full-screen-container>
     <TheHeader />
 
-    <div class="main-content flex flex-wrap flex-1">
-      <div class="w-1/2 h/1/2">
-				<PlanisphereView />
+    <div class="main-content flex-1 grid grid-cols-2 grid-rows-2">
+      <div>
+				<SNRView title="北斗" />
 			</div>
-			<div class="w-1/2 h/1/2">
-				<PlanisphereView />
+			<div>
+				<SNRView title="GPS" />
 			</div>
-			<div class="w-1/2 h/1/2">
-				<PlanisphereView />
+			<div>
+				<SNRView title="格洛纳斯" />
 			</div>
-			<div class="w-1/2 h/1/2">
-				<PlanisphereView />
+			<div>
+				<SNRView title="伽利略" />
 			</div>
     </div>
   </full-screen-container>

src/render/components/PlanisphereView.vue

@@ -29,7 +29,6 @@ const option = reactive({
   title: {
     text: props.title,
     left: 'center'
-    // textAlign: 'center'
   },
   polar: {
     radius: '75%'

src/render/components/SNRView.vue

@@ -9,17 +9,22 @@ import { reactive } from "vue"
 import { use, graphic } from "echarts/core";
 import { CanvasRenderer } from "echarts/renderers";
 import { BarChart } from "echarts/charts";
-import { GridComponent } from "echarts/components";
+import { TitleComponent, GridComponent } from "echarts/components";
 import VChart from "vue-echarts";
-import utils from '../api/utils'
+import { get_in_positioning_id } from '../api/util'
 
 
 use([
   CanvasRenderer,
   BarChart,
+	TitleComponent,
   GridComponent
 ]);
 
+const props = defineProps({
+  title: String
+})
+
 const BAR_COUNT			   		 = 16
 const UN_POSITIONING_COLOR = '#9ca3af'
 const IN_POSITIONING_COLOR = new graphic.LinearGradient(
@@ -31,6 +36,10 @@ const IN_POSITIONING_COLOR = new graphic.LinearGradient(
 )
 
 const option 			 = reactive({
+  title: {
+    text: props.title,
+    left: 'center'
+  },
 	grid: {
 		containLabel: true
 	},