页面微调

neim-ui/src/App.vue

@@ -17,3 +17,6 @@ export default  {
   }
 }
 </script>
+<style lang="scss">
+@import "~@/assets/styles/screenPage.scss";
+</style>

neim-ui/src/assets/styles/screenPage.scss

@@ -0,0 +1,150 @@
+@media screen and (min-width: 1950px) and (max-width: 3840px){
+  .page .timeBox{
+    font-size: 30px !important;
+    line-height: 50px !important;
+  }
+  .myMain-container {
+    .rightTextBg {
+      min-width: 500px;
+    }
+    .rightTiltleTextBg .rightMainTitle , .branckTitleBg .branckTitle{
+      font-size: 30px;
+    }
+    .content {
+      font-size: 24px;
+    }
+    /*右侧主体*/
+    .rightBg .contentBox {
+      height: 150px !important;
+      font-size: 20px;
+    }
+    .rightBg .contentBox .numberBox{
+      font-size: 30px !important;
+    }
+    .textBtu{
+      font-size: 20px;
+    }
+  }
+  #position{
+    position: absolute;
+    bottom: 0;
+    font-size: 25px;
+  }
+  .btuGroup{
+    font-size: 24px !important;
+  }
+  .kaiguanBox img ,.mapImg img{
+    width: 40px !important;
+    height: 40px !important;
+  }
+  /*中间标题*/
+  .topTiltle .title{
+    font-size: 40px !important;
+  }
+  /*图层切换按钮*/
+  .mapBtuBg .mapBtu{
+    height: 70px !important;
+    width: 300px !important;
+  }
+  .mapBtuBg .mapBtuText{
+    line-height: 70px !important;
+    font-size: 25px !important;
+  }
+  /*弹框信息*/
+  .dialogInfoBg{
+    .rightMainTitle{
+      font-size: 32px !important;
+    }
+    .projectInfoBox{
+      font-size: 30px;
+    }
+    .dialogInfo{
+      font-size: 24px !important;
+    }
+  }
+  /*右下返回按钮*/
+  .bottomPushBtu{
+    line-height: 80px !important;
+    font-size: 24px;
+  }
+}
+@media screen and (max-width: 1920px) and (min-width: 1540px){
+  .myMain-container {
+    .rightTextBg {
+      min-width: 380px;
+    }
+    .rightTiltleTextBg .rightMainTitle , .branckTitleBg .branckTitle{
+      font-size: 20px;
+    }
+    .content {
+      font-size: 16px;
+    }
+    /*切换图层按钮*/
+    .mapBtuBg{
+      right: 22% !important;
+    }
+  }
+}
+
+@media screen and (max-width: 1540px){
+  /*时间*/
+  .page .timeBox{
+    font-size: 16px !important;
+    line-height: 25px !important;
+  }
+  /*右侧主体框*/
+  .myMain-container {
+    .rightTextBg {
+      min-width: 380px;
+    }
+    .rightTiltleTextBg .rightMainTitle , .branckTitleBg .branckTitle{
+      font-size: 16px;
+    }
+    .mainContent {
+      .content {
+        font-size: 14px;
+      }
+    }
+    /*切换图层按钮*/
+    .mapBtuBg{
+      right: 28% !important;
+    }
+    .rightBg .contentBox {
+      height: 100px !important;
+    }
+  }
+  /*地图经纬度*/
+  #position{
+    position: absolute;
+    bottom: 0;
+    font-size: 14px;
+  }
+  /*地图图例*/
+  .legend-map img{
+    width: 290px;
+  }
+  /*右上按钮*/
+  .btuGroup{
+    font-size: 14px !important;
+  }
+  /*左上图片*/
+  .kaiguanBox img ,.mapImg img{
+    width: 20px !important;
+    height: 20px !important;
+  }
+  /*中间标题*/
+  .topTiltle .title{
+    font-size: 24px !important;
+  }
+  /*右下返回按钮*/
+  .bottomPushBtu{
+    width: 16% !important;
+  }
+  .stationInfoPage .rightBg{
+    height: 95%;
+  }
+  .stationInfoPage .right-content-main{
+    height: 95%;
+    overflow-y: scroll;
+  }
+}

neim-ui/src/views/largeScreenPage/Subpage/provincialEnergyStations.vue

@@ -4,7 +4,12 @@
       <div class="timeBox">{{ time }}</div>
       <div class="kaiguanBox"><img src="../../../../public/largeScreenImg/kaiguan.png" style="width: 30px;height: 30px" @click="pushZaiXian()"/></div>
       <div class="topTiltle">
-        <span class="title">全省新能源场站概况</span>
+<!--        <span class="title">全省新能源场站概况</span>-->
+        <img
+          class="titleImg"
+          referrerpolicy="no-referrer"
+          src="../../../assets/largeScreenImg/index/quansheng.png"
+        />
       </div>
       <div class="btuGroup">
         <div class="topBtu topRightBtu" @click="pushPreProject()">
@@ -282,7 +287,11 @@ export default {
   display: flex;
   justify-content: center;
 }
-
+.titleImg {
+  width: 17%;
+  height: 60%;
+  margin-top: .5%;
+}
 .title {
   width: 17%;
   height: 100%;

neim-ui/src/views/largeScreenPage/Subpage/stationInfo.vue

@@ -28,155 +28,155 @@
 
             </div>
           </div>
-
-          <div class="rightTopContent" v-for="item in dataInfo">
-            <div class="branckTitleBg">
+          <div class="right-content-main">
+            <div class="rightTopContent" v-for="item in dataInfo">
+              <div class="branckTitleBg">
               <span class="fjModel">{{ item.modelType }}
                 <span class="number" style="margin-left: 4%">{{ item.modelTotal }}</span>台</span>
-            </div>
-            <div>
-              <div class="rightMain"  v-if="station.type === '风'">
-                <div class="contentBox">
-                  <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>
-                  <span class="textBox">平均风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>
-                </div>
-                <div class="tabelTextbg">
-                  <div class="tabelText">
-                    <div>最小风速:</div>
-                    <span>{{ item.wsMin.replace(/\.?0+$/, "") }} (m/s)</span>
+              </div>
+              <div>
+                <div class="rightMain" v-if="station.type === '风'">
+                  <div class="contentBox">
+                    <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>
+                    <span class="textBox">平均风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>
                   </div>
-                  <div class="tabelText">
-                    <div>最大风速:</div>
-                    <span>{{ item.wsMax.replace(/\.?0+$/, "") }}(m/s)</span>
+                  <div class="tabelTextbg">
+                    <div class="tabelText">
+                      <div>最小风速:</div>
+                      <span>{{ item.wsMin.replace(/\.?0+$/, "") }} (m/s)</span>
+                    </div>
+                    <div class="tabelText">
+                      <div>最大风速:</div>
+                      <span>{{ item.wsMax.replace(/\.?0+$/, "") }}(m/s)</span>
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div class="rightMain" v-else>
-                <div class="contentBox">
-                  <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>
-                  <span class="textBox">平均日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>
-                </div>
-                <div class="tabelTextbg">
-                  <div class="tabelText">
-                    <div>最小日照:</div>
-                    <span>{{ item.wsMin.replace(/\.?0+$/, "") }} (W/m²)</span>
+                <div class="rightMain" v-else>
+                  <div class="contentBox">
+                    <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>
+                    <span class="textBox">平均日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>
                   </div>
-                  <div class="tabelText">
-                    <div>最大日照:</div>
-                    <span>{{ item.wsMax.replace(/\.?0+$/, "") }}(W/m²)</span>
+                  <div class="tabelTextbg">
+                    <div class="tabelText">
+                      <div>最小日照:</div>
+                      <span>{{ item.wsMin.replace(/\.?0+$/, "") }} (W/m²)</span>
+                    </div>
+                    <div class="tabelText">
+                      <div>最大日照:</div>
+                      <span>{{ item.wsMax.replace(/\.?0+$/, "") }}(W/m²)</span>
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div style="width: 100%;display: flex;justify-content: center">
-              <dv-decoration-10 style="width:80%;height:5px;" />
-              </div>
-
-              <div class="rightMain">
-                <div class="contentBox">
-                  <span class="numberBox">{{ item.generatingCapacityr.replace(/\.?0+$/, "") }}</span>
-                  <span class="textBox">发电量<div class="numberBox" style="font-size: 14px">(MWh)</div></span>
+                <div style="width: 100%;display: flex;justify-content: center">
+                  <dv-decoration-10 style="width:80%;height:5px;"/>
                 </div>
-                <div class="tabelTextbg">
-                  <div class="tabelText">
-                    <div>月发电量:</div>
-                    <span>{{ item.generatingCapacityy.replace(/\.?0+$/, "") }} (MWh)</span>
+
+                <div class="rightMain">
+                  <div class="contentBox">
+                    <span class="numberBox">{{ item.generatingCapacityr.replace(/\.?0+$/, "") }}</span>
+                    <span class="textBox">发电量<div class="numberBox" style="font-size: 14px">(MWh)</div></span>
                   </div>
-                  <div class="tabelText">
-                    <div>年发电量:</div>
-                    <span>{{ item.generatingCapacity.replace(/\.?0+$/, "") }}(MWh)</span>
+                  <div class="tabelTextbg">
+                    <div class="tabelText">
+                      <div>月发电量:</div>
+                      <span>{{ item.generatingCapacityy.replace(/\.?0+$/, "") }} (MWh)</span>
+                    </div>
+                    <div class="tabelText">
+                      <div>年发电量:</div>
+                      <span>{{ item.generatingCapacity.replace(/\.?0+$/, "") }}(MWh)</span>
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div style="width: 100%;display: flex;justify-content: center">
-                <dv-decoration-10 style="width:80%;height:5px;" />
-              </div>
-              <div class="rightMain">
-                <div class="contentBox">
-                  <span class="numberBox">{{ item.realTimeTotalr.replace(/\.?0+$/, "") }}</span>
-                  <span class="textBox">满发小时数<div class="numberBox" style="font-size: 14px">(h)</div></span>
+                <div style="width: 100%;display: flex;justify-content: center">
+                  <dv-decoration-10 style="width:80%;height:5px;"/>
                 </div>
-                <div class="tabelTextbg">
-                  <div class="tabelText">
-                    <div>月累计:</div>
-                    <span>{{ item.realTimeTotaly.replace(/\.?0+$/, "") }} (h)</span>
+                <div class="rightMain">
+                  <div class="contentBox">
+                    <span class="numberBox">{{ item.realTimeTotalr.replace(/\.?0+$/, "") }}</span>
+                    <span class="textBox">满发小时数<div class="numberBox" style="font-size: 14px">(h)</div></span>
                   </div>
-                  <div class="tabelText">
-                    <div>年累计:</div>
-                    <span>{{ item.realTimeTotal.replace(/\.?0+$/, "") }}(h)</span>
+                  <div class="tabelTextbg">
+                    <div class="tabelText">
+                      <div>月累计:</div>
+                      <span>{{ item.realTimeTotaly.replace(/\.?0+$/, "") }} (h)</span>
+                    </div>
+                    <div class="tabelText">
+                      <div>年累计:</div>
+                      <span>{{ item.realTimeTotal.replace(/\.?0+$/, "") }}(h)</span>
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
 
 
-            <!--            -->
-<!--            <div class="mainContent" v-if="station.type === '风'">-->
-<!--              <div class="contentBox">-->
-<!--                <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>-->
-<!--                <span class="textBox">平均风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>-->
-<!--              </div>-->
-<!--              <div class="contentBox">-->
-<!--                <span class="numberBox">{{ item.wsMax.replace(/\.?0+$/, "") }}</span>-->
-<!--                <span class="textBox">最大风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>-->
-<!--              </div>-->
-<!--              <div class="contentBox">-->
-<!--                <span class="numberBox">{{ item.wsMin }}</span>-->
-<!--                <span class="textBox">最小风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>-->
-<!--              </div>-->
-<!--            </div>-->
-<!--            <div class="mainContent" v-else>-->
-<!--              <div class="contentBox">-->
-<!--                <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>-->
-<!--                <span class="textBox">平均日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>-->
-<!--              </div>-->
-<!--              <div class="contentBox">-->
-<!--                <span class="numberBox">{{ item.wsMax.replace(/\.?0+$/, "") }}</span>-->
-<!--                <span class="textBox">最大日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>-->
-<!--              </div>-->
-<!--              <div class="contentBox">-->
-<!--                <span class="numberBox">{{ item.wsMin }}</span>-->
-<!--                <span class="textBox">最小日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>-->
-<!--              </div>-->
-<!--            </div>-->
-<!--            <div style="display: flex;flex-wrap: wrap;justify-content: space-around;">-->
-<!--              <div class="tabelTextbg">-->
-<!--                <div style="width: 100%;text-align: center;margin-bottom: 1%">发电量 (MWh)</div>-->
-<!--                <div class="split-line"></div>-->
-<!--                &lt;!&ndash;              <el-divider></el-divider>&ndash;&gt;-->
-<!--                <div class="tabelText" style="padding-top: 2%;">-->
-<!--                  <div>日累计:</div>-->
-<!--                  <div>{{ item.generatingCapacityr.replace(/\.?0+$/, "") }}</div>-->
-<!--                </div>-->
-<!--                <div class="tabelText">-->
-<!--                  <div>月累计:</div>-->
-<!--                  <div>{{ item.generatingCapacityy.replace(/\.?0+$/, "") }}</div>-->
-<!--                </div>-->
-<!--                <div class="tabelText">-->
-<!--                  <div>年累计:</div>-->
-<!--                  <div>{{ item.generatingCapacity.replace(/\.?0+$/, "") }}</div>-->
-<!--                </div>-->
-<!--              </div>-->
-<!--              <div class="tabelTextbg">-->
-<!--                <div style="width: 100%;text-align: center;margin-bottom: 1%">等效小时数 (h)</div>-->
-<!--                <div class="split-line"></div>-->
-<!--                &lt;!&ndash;              <el-divider></el-divider>&ndash;&gt;-->
-<!--                <div class="tabelText" style="padding-top: 2%;">-->
-<!--                  <div>日累计:</div>-->
-<!--                  <div>{{ item.realTimeTotalr.replace(/\.?0+$/, "") }}</div>-->
-<!--                </div>-->
-<!--                <div class="tabelText">-->
-<!--                  <div>月累计:</div>-->
-<!--                  <div>{{ item.realTimeTotaly.replace(/\.?0+$/, "") }}</div>-->
-<!--                </div>-->
-<!--                <div class="tabelText">-->
-<!--                  <div>年累计:</div>-->
-<!--                  <div>{{ item.realTimeTotal.replace(/\.?0+$/, "") }}</div>-->
-<!--                </div>-->
-<!--              </div>-->
-<!--            </div>-->
+              <!--            -->
+              <!--            <div class="mainContent" v-if="station.type === '风'">-->
+              <!--              <div class="contentBox">-->
+              <!--                <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>-->
+              <!--                <span class="textBox">平均风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>-->
+              <!--              </div>-->
+              <!--              <div class="contentBox">-->
+              <!--                <span class="numberBox">{{ item.wsMax.replace(/\.?0+$/, "") }}</span>-->
+              <!--                <span class="textBox">最大风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>-->
+              <!--              </div>-->
+              <!--              <div class="contentBox">-->
+              <!--                <span class="numberBox">{{ item.wsMin }}</span>-->
+              <!--                <span class="textBox">最小风速<div class="numberBox" style="font-size: 14px">(m/s)</div></span>-->
+              <!--              </div>-->
+              <!--            </div>-->
+              <!--            <div class="mainContent" v-else>-->
+              <!--              <div class="contentBox">-->
+              <!--                <span class="numberBox">{{ item.wsAve.replace(/\.?0+$/, "") }}</span>-->
+              <!--                <span class="textBox">平均日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>-->
+              <!--              </div>-->
+              <!--              <div class="contentBox">-->
+              <!--                <span class="numberBox">{{ item.wsMax.replace(/\.?0+$/, "") }}</span>-->
+              <!--                <span class="textBox">最大日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>-->
+              <!--              </div>-->
+              <!--              <div class="contentBox">-->
+              <!--                <span class="numberBox">{{ item.wsMin }}</span>-->
+              <!--                <span class="textBox">最小日照<div class="numberBox" style="font-size: 14px">(W/m²)</div></span>-->
+              <!--              </div>-->
+              <!--            </div>-->
+              <!--            <div style="display: flex;flex-wrap: wrap;justify-content: space-around;">-->
+              <!--              <div class="tabelTextbg">-->
+              <!--                <div style="width: 100%;text-align: center;margin-bottom: 1%">发电量 (MWh)</div>-->
+              <!--                <div class="split-line"></div>-->
+              <!--                &lt;!&ndash;              <el-divider></el-divider>&ndash;&gt;-->
+              <!--                <div class="tabelText" style="padding-top: 2%;">-->
+              <!--                  <div>日累计:</div>-->
+              <!--                  <div>{{ item.generatingCapacityr.replace(/\.?0+$/, "") }}</div>-->
+              <!--                </div>-->
+              <!--                <div class="tabelText">-->
+              <!--                  <div>月累计:</div>-->
+              <!--                  <div>{{ item.generatingCapacityy.replace(/\.?0+$/, "") }}</div>-->
+              <!--                </div>-->
+              <!--                <div class="tabelText">-->
+              <!--                  <div>年累计:</div>-->
+              <!--                  <div>{{ item.generatingCapacity.replace(/\.?0+$/, "") }}</div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--              <div class="tabelTextbg">-->
+              <!--                <div style="width: 100%;text-align: center;margin-bottom: 1%">等效小时数 (h)</div>-->
+              <!--                <div class="split-line"></div>-->
+              <!--                &lt;!&ndash;              <el-divider></el-divider>&ndash;&gt;-->
+              <!--                <div class="tabelText" style="padding-top: 2%;">-->
+              <!--                  <div>日累计:</div>-->
+              <!--                  <div>{{ item.realTimeTotalr.replace(/\.?0+$/, "") }}</div>-->
+              <!--                </div>-->
+              <!--                <div class="tabelText">-->
+              <!--                  <div>月累计:</div>-->
+              <!--                  <div>{{ item.realTimeTotaly.replace(/\.?0+$/, "") }}</div>-->
+              <!--                </div>-->
+              <!--                <div class="tabelText">-->
+              <!--                  <div>年累计:</div>-->
+              <!--                  <div>{{ item.realTimeTotal.replace(/\.?0+$/, "") }}</div>-->
+              <!--                </div>-->
+              <!--              </div>-->
+              <!--            </div>-->
+            </div>
           </div>
 
-
         </div>
 
       </div>
@@ -607,10 +607,12 @@ export default {
   flex-wrap: wrap;
   justify-content: center;
 }
-.rightMain{
+
+.rightMain {
   display: flex;
   align-items: center;
 }
+
 .contentBox {
   margin-top: 2%;
   width: 40%;
@@ -740,7 +742,7 @@ export default {
 /* 设置scrollbar-thumb之前要设置scrollbar的width和height */
 ::-webkit-scrollbar-track {
   border-radius: 0;
-  background-color: #f2f3f8;
+  background-color: transparent;
 }
 
 ::-webkit-scrollbar-thumb {
@@ -752,7 +754,7 @@ export default {
 }
 
 ::-webkit-scrollbar-corner {
-  background-color: #f2f3f8;
+  background-color: transparent;
 }
 
 ::-webkit-scrollbar {

neim-ui/src/views/largeScreenPage/components/bigeHeatMap.vue

@@ -9,7 +9,7 @@
         当前中心点: 纬度:0.00000,经度:0.00000
       </div>
     </div>
-    <div style="position: fixed;bottom: 8%;left:.5%;z-index: 1000;box-shadow: rgb(56 76 85) 0px 1px 9px 4px inset">
+    <div class="legend-map">
       <img src="../../../../public/largeScreenImg/80mWs3.png">
     </div>
     <!--    <el-radio-group v-model="leavel" @change="setData">-->
@@ -639,26 +639,26 @@ export default {
          * 加载实时气象源动画效果
          fetch("/js/json/wind_data/20230403_00_atmoslev_1000_mb.json")
          .then((res) => {
-            return res.json();
-          })
+         return res.json();
+         })
          .then((data) => {
-            this.velocityLayer = window.BM.velocityLayer({
-              displayValues: true,
-              displayOptions: {
-                velocityType: "windy",
-                displayPosition: "topright",
-                displayEmptyString: "没有数据",
-                directionString: "风向",
-                speedString: "速度",
-              },
-              data: data,
-              minVelocity: 0.05,
-              maxVelocity: 10,
-              colorScale: ["red", "green", "yellow", "pink"],
-              velocityScale: 0.02, //  default 0.005,
-            });
-            this.velocityLayer.addTo(this.bMmap);
-          });
+         this.velocityLayer = window.BM.velocityLayer({
+         displayValues: true,
+         displayOptions: {
+         velocityType: "windy",
+         displayPosition: "topright",
+         displayEmptyString: "没有数据",
+         directionString: "风向",
+         speedString: "速度",
+         },
+         data: data,
+         minVelocity: 0.05,
+         maxVelocity: 10,
+         colorScale: ["red", "green", "yellow", "pink"],
+         velocityScale: 0.02, //  default 0.005,
+         });
+         this.velocityLayer.addTo(this.bMmap);
+         });
          */
       })
     },
@@ -819,4 +819,12 @@ export default {
   border-radius: 8px;
   box-shadow: 5px 5px 5px rgb(0 0 0);
 }
+
+.legend-map {
+  position: fixed;
+  bottom: 8%;
+  left: .5%;
+  z-index: 1000;
+  box-shadow: rgb(56 76 85) 0px 1px 9px 4px inset
+}
 </style>

neim-ui/src/views/largeScreenPage/components/bigeHeatSunMap.vue

@@ -9,7 +9,7 @@
         当前中心点: 纬度:0.00000,经度:0.00000
       </div>
     </div>
-    <div style="position: fixed;bottom: 8%;left:.5%;z-index: 1000;box-shadow: rgb(56 76 85) 0px 1px 9px 4px inset">
+    <div class="legend-map">
       <img src="../../../../public/largeScreenImg/sun.png" style="color: white">
     </div>
     <!--    <el-radio-group v-model="leavel" @change="setData">-->
@@ -53,8 +53,8 @@ export default {
       code: 230000,
       mapData: {},// 传过来的值
       href: window.location.href,
-      level:6,
-      center:[],
+      level: 6,
+      center: [],
     }
   },
   mounted() {
@@ -82,7 +82,7 @@ export default {
         let map = window.BM.map('map', null, {
           center: [30, 104],
           minZoom: 6,
-          maxZoom:12,
+          maxZoom: 12,
           zoom: 11,
           zoomControl: true,
           attributionControl: false,
@@ -112,7 +112,7 @@ export default {
                 return tile;
               }
             });
-            new CanvasLayer({maxZoom:12}).addTo(map);
+            new CanvasLayer({maxZoom: 12}).addTo(map);
           }
         )
         window.Bmap = map;
@@ -139,7 +139,7 @@ export default {
                 tile.style.backgroundColor = 'inherit';
                 tile.src = `${ip2}/${heatmapid}/tiles/${z}/${x}/${y}.png?access_token=${token}`
                 // 给热力图图层加上错误处理事件
-                tile.onerror=function(){
+                tile.onerror = function () {
                   tile.remove()
                 }
                 setTimeout(function () {
@@ -150,14 +150,14 @@ export default {
               }
             });
             new CanvasLayer({
-              maxNativeZoom:8,
-              maxZoom:12,
-              opacity:0.7
+              maxNativeZoom: 8,
+              maxZoom: 12,
+              opacity: 0.7
             }).addTo(map);
           }
         )
         this.bMap = map;
-        setTimeout(()=>{
+        setTimeout(() => {
           // Object.assign(layer2.options,{
           //   opacity:0.7,
           //   maxNativeZoom:8,
@@ -170,7 +170,7 @@ export default {
           } else {
             this.bMap.setView([46.69090, 128.13354], 7)
           }
-        },500)
+        }, 500)
         //layer2.addTo(map);
         this.bMap = map;
         //首尾需要一致
@@ -213,8 +213,8 @@ export default {
           //限制拖动
           // this.bMap.setMaxBounds(geo2.getBounds());
           // this.bMap.fitBounds(geo2.getBounds());
-          this.bMap.setMaxBounds([[43.42301,122.574976],[53.561657,135.086264]]);
-          this.bMap.fitBounds([[43.42301,122.574976],[53.561657,135.086264]]);
+          this.bMap.setMaxBounds([[43.42301, 122.574976], [53.561657, 135.086264]]);
+          this.bMap.fitBounds([[43.42301, 122.574976], [53.561657, 135.086264]]);
           const layers = geo2.getLayers();
           for (const item of layers) {
             const layer = item.feature;
@@ -270,13 +270,13 @@ export default {
           for (let item of data.otherStation) {
             let coordinate = [Number(item.latitude), Number(item.longitude)]
             let marker = '';
-            if(item.type === '风'){
+            if (item.type === '风') {
               marker = window.BM.marker(coordinate, {
                 icon: station_icon,
                 riseOnHover: true
               }).addTo(this.bMap);
-            }else {
-              marker =window.BM.marker(coordinate, {
+            } else {
+              marker = window.BM.marker(coordinate, {
                 icon: gfstation_icon,
                 riseOnHover: true
               }).addTo(this.bMap);
@@ -293,12 +293,12 @@ export default {
           for (let item of data.HDStation) {
             let coordinate = [Number(item.latitude), Number(item.longitude)]
             let marker = '';
-            if(item.type === '风'){
+            if (item.type === '风') {
               marker = window.BM.marker(coordinate, {
                 icon: hf_station_icon,
                 riseOnHover: true
               }).addTo(this.bMap);
-            }else {
+            } else {
               marker = window.BM.marker(coordinate, {
                 icon: hf_gfstation_icon,
                 riseOnHover: true
@@ -323,7 +323,7 @@ export default {
             iconAnchor: [30, 50]
           })
           for (let item of data) {
-            if(item.latitude !== undefined) {
+            if (item.latitude !== undefined) {
               let coordinate = [Number(item.latitude), Number(item.longitude)]
               let marker = window.BM.marker(coordinate, {
                 icon: station_icon,
@@ -465,7 +465,7 @@ export default {
             })
             // 点击动作
             marker.on('click', function (e) {
-              let station = {stationId:item.stationId,equipmentNo:item.id}
+              let station = {stationId: item.stationId, equipmentNo: item.id}
               sessionStorage.setItem("realPvWindTowerInfo", JSON.stringify(station))
               _self.$store.dispatch('equipmentInfo/realPvWindTowerInfo', JSON.stringify(station))
               _self.$router.push({path: "/homepage/realPvResourcesInfo"})
@@ -482,7 +482,7 @@ export default {
               }).addTo(this.bMap);
               marker.on('mouseover', function (e) {
                 // console.log(item)
-                marker.bindTooltip('<div>所属场站名称：' + inverter.name + '</div>'+'<div>逆变器名称：' + item.name + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
+                marker.bindTooltip('<div>所属场站名称：' + inverter.name + '</div>' + '<div>逆变器名称：' + item.name + '</div>' + '<div>经度：' + item.longitude + '</div>' + '<div>纬度：' + item.latitude + '</div>',
                   {permanent: true, className: 'infoToolTip', offset: [0, -30]}).openTooltip();
               })
               marker.on('mouseout', function () {
@@ -498,12 +498,12 @@ export default {
             for (let item of fan.data) {
               let coordinate = [Number(item.latitudeFan), Number(item.longitudeFan)]
               let marker = ''
-              if(fan.type === 'project'){
+              if (fan.type === 'project') {
                 marker = window.BM.marker(coordinate, {
                   icon: redFengji,
                   riseOnHover: true
                 }).addTo(this.bMap);
-              }else {
+              } else {
                 if (item.type !== null) {
                   if (item.type === '新') {
                     marker = window.BM.marker(coordinate, {
@@ -544,7 +544,7 @@ export default {
           for (let coordinatesList of data.coordinatesList) {
             for (let key in coordinatesList) {
               let coordinates = coordinatesList[key]
-              if(coordinates !== null){
+              if (coordinates !== null) {
                 for (let item of coordinates) {
                   if (item.length > 0) {
                     let latlngs = []
@@ -622,26 +622,26 @@ export default {
          * 加载实时气象源动画效果
          fetch("/js/json/wind_data/20230403_00_atmoslev_1000_mb.json")
          .then((res) => {
-            return res.json();
-          })
+         return res.json();
+         })
          .then((data) => {
-            this.velocityLayer = window.BM.velocityLayer({
-              displayValues: true,
-              displayOptions: {
-                velocityType: "windy",
-                displayPosition: "topright",
-                displayEmptyString: "没有数据",
-                directionString: "风向",
-                speedString: "速度",
-              },
-              data: data,
-              minVelocity: 0.05,
-              maxVelocity: 10,
-              colorScale: ["red", "green", "yellow", "pink"],
-              velocityScale: 0.02, //  default 0.005,
-            });
-            this.velocityLayer.addTo(this.bMmap);
-          });
+         this.velocityLayer = window.BM.velocityLayer({
+         displayValues: true,
+         displayOptions: {
+         velocityType: "windy",
+         displayPosition: "topright",
+         displayEmptyString: "没有数据",
+         directionString: "风向",
+         speedString: "速度",
+         },
+         data: data,
+         minVelocity: 0.05,
+         maxVelocity: 10,
+         colorScale: ["red", "green", "yellow", "pink"],
+         velocityScale: 0.02, //  default 0.005,
+         });
+         this.velocityLayer.addTo(this.bMmap);
+         });
          */
       })
     },
@@ -775,19 +775,20 @@ export default {
 }
 </script>
 <style>
-.infoToolTip{
+.infoToolTip {
   color: white !important;
-  background: rgba(0, 133, 212, 0.75)  !important;
+  background: rgba(0, 133, 212, 0.75) !important;
   border: .5px solid #0085d4;
 }
 
-.my_tooltip{
+.my_tooltip {
   color: #0085d4 !important;
   background: transparent !important;
   border: none !important;
   /*font-size: 18px;*/
 }
-.my_tooltip::before{
+
+.my_tooltip::before {
   display: none;
 }
 </style>
@@ -801,4 +802,12 @@ export default {
   border-radius: 8px;
   box-shadow: 5px 5px 5px rgb(0 0 0);
 }
+
+.legend-map {
+  position: fixed;
+  bottom: 8%;
+  left: .5%;
+  z-index: 1000;
+  box-shadow: rgb(56 76 85) 0px 1px 9px 4px inset
+}
 </style>