Quellcode durchsuchen

风机集电线路折线绘制

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 vor 1 Jahr
Ursprung
Commit
825113d752

+ 656 - 560
src/views/economicsOperation/stationAnalyse/posAnalysis/components/leafletMap.vue

@@ -1,584 +1,680 @@
 <template>
-    <div class="mapCom">
-        <div id="map"></div>
-    </div>
+  <div class="mapCom">
+    <div id="map"></div>
+  </div>
 </template>
 <script>
-    // import httpRequest from "@/utils/request.js";
-    import httpRequest from "@/tools/request.js";
-    import {
-        CanvasLabel
-    } from "@panzhiyue/leaflet-canvaslabel";
-    import "./leaflet.canvas-markers.js";
-    export default {
-        props: {
-            ids: {
-                type: Array,
-                default: () => {
-                    return [];
-                },
-            },
-            windList: {
-                type: Array,
-                default: () => {
-                    return [];
-                },
-            },
+// import httpRequest from "@/utils/request.js";
+import httpRequest from "@/tools/request.js";
+import { CanvasLabel } from "@panzhiyue/leaflet-canvaslabel";
+import "./leaflet.canvas-markers.js";
+export default {
+  props: {
+    ids: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    windList: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {
+      map: null,
+      DefaultIcon1: null,
+      layerGroup: [],
+      layers: [],
+      rightObj: {},
+      areaLayer: null,
+      tilsUrl: "./static/kMapTiles/{z}/{x}/{y}.jpg",
+      ciLayer: null,
+      viewCenterMap: {
+        NX_FGS_HA_FDC_STA: {
+          lng: 106.776222,
+          lat: 37.469638,
         },
-        data() {
-            return {
-                map: null,
-                DefaultIcon1: null,
-                layerGroup: [],
-                layers: [],
-                rightObj: {},
-                areaLayer: null,
-                tilsUrl: "./static/kMapTiles/{z}/{x}/{y}.jpg",
-                ciLayer: null,
-                viewCenterMap: {
-                    NX_FGS_HA_FDC_STA: {
-                        lng: 106.776222,
-                        lat: 37.469638
-                    }
-                },
-            };
-        },
-
-        watch: {
-            ids(val) {
-                this.funStationPos(val);
-                // this.funStationPosLabel(val)
-            },
-        },
-
-        mounted() {
-            this.initMap();
-        },
-
-        unmounted() {
-            this.map.remove();
-            this.map = null;
-        },
-
-        methods: {
-            initMap() {
-                // 矢量文本标签渲染器
-                let canvasLabel = new L.CanvasLabel({
-                    collisionFlg: true,
-                    scale: 2,
-                });
-                this.map = L.map("map", {
-                    renderer: canvasLabel,
-                    // center: [40.02404009136253, 116.50641060224784], // 地图中心--北京
-                    // center: [38.44673272215545, 106.27624511718751], // 地图中心--银川
-                    // center: [108.953939, 34.266611], // 地图中心--陕西
-                    // center: [109.470962, 34.520632], // 地图中心--渭南
-                    zoom: 17, //缩放比列
-                    zoomControl: false, //禁用 + - 按钮
-                    doubleClickZoom: true, // 禁用双击放大
-                    attributionControl: false, // 移除右下角leaflet标识
-                    preferCanvas: true,
-                    contextmenu: true,
-                    contextmenuWidth: 140,
-                    // contextmenuItems: [{
-                    //         text: "功率曲线拟合分析",
-                    //         callback: this.powerLine,
-                    //     },
-                    //     {
-                    //         text: "对风偏差分析",
-                    //         callback: this.windAny,
-                    //     },
-                    //     {
-                    //         text: "曲线偏差率分析",
-                    //         callback: this.qxAny,
-                    //     },
-                    //     {
-                    //         text: "温度与功率分析",
-                    //         callback: this.wdyglAny,
-                    //     },
-                    //     {
-                    //         text: "损失电量分析",
-                    //         callback: this.ssdlAny,
-                    //     },
-                    //     {
-                    //         text: "桨距角分析",
-                    //         callback: this.jjjAny,
-                    //     },
-                    // ],
-                });
-                // let name = L.tileLayer(
-                //   "http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}"
-                // ).addTo(this.map);
-
-                let name = L.tileLayer(this.tilsUrl, {
-                    minZoom: 6,
-                    maxZoom: 17,
-                }).addTo(this.map);
-
-                // this.setAreaLayer("db", true);
-                // this.setAreaLayer("jb", true);
-                this.setAreaLayer("nx", true);
-            },
-
-            async funStationPos(ids) {
-                let res = null;
-                this.rightObj = {};
-                if (ids.length > 0) {
-                    res = await httpRequest.get("/base/windturbine", {
-                        params: {
-                            wpids: this.ids.join(","),
-                        },
-                    });
-                } else {
-                    // res = await httpRequest.get("/base/station", {
-                    //     params: {},
-                    // });
-                    tabStr = "station"
-                    let datas = await httpRequest.get("/benchmarking/wpByCplist?companyids=NX_FGS&type=-1");
-                    res = datas.data
-                }
-
-                if (res.code === 200) {
-                    if (res.data && res.data.data && res.data.data.length) {
-                        // 清除现有的 layers
-                        this.layers.forEach((layer) => {
-                            this.map.removeLayer(layer);
-                        });
-                        this.layers = [];
-
-                        const viewCenter =
-                            this.viewCenterMap[res.data.data[0].windpowerstationId] || null;
-
-                        if (!this.ciLayer) {
-                            this.ciLayer = L.canvasIconLayer({}).addTo(this.map);
-                        } else {
-                            this.ciLayer.clearLayers();
-                        }
-
-                        //   let iconUrl = require(`@/assets/images/indexCom/run_Icon.gif`);
-                        let iconUrl = require(`@/assets/images/indexCom/fengji.png`);
-                        // const img = new Image();
-                        // img.src = require("@/assets/images/indexCom/run_Icon.gif");
-
-                        for (let i = 0; i < res.data.data.length; i++) {
-                            let item = res.data.data[i];
-
-                            let marker = L.marker(
-                                [Number(item.latitude), Number(item.longitude)], {
-                                    icon: L.divIcon({
-                                            className: "iconSty",
-                                            iconUrl: iconUrl,
-                                            iconSize: [30, 39],
-                                            iconAnchor: [15, 12.5],
-                                        }
-                                        // {
-                                        //   className: "currentMapIcon",
-                                        //   html: `<img src="${img.src}" style="width: 30px; height: 39px;">`,
-                                        //   iconSize: [30, 39],
-                                        //   iconAnchor: [15, 12.5],
-                                        // }
-                                    ),
-                                    data: item,
-                                }
-                            ).bindTooltip(
-                                `
+      },
+    };
+  },
+
+  watch: {
+    ids(val) {
+      this.funStationPos(val);
+      // this.funStationPosLabel(val)
+    },
+  },
+
+  mounted() {
+    this.initMap();
+  },
+
+  unmounted() {
+    this.map.remove();
+    this.map = null;
+  },
+
+  methods: {
+    initMap() {
+      // 矢量文本标签渲染器
+      let canvasLabel = new L.CanvasLabel({
+        collisionFlg: true,
+        scale: 2,
+      });
+      this.map = L.map("map", {
+        renderer: canvasLabel,
+        // center: [40.02404009136253, 116.50641060224784], // 地图中心--北京
+        // center: [38.44673272215545, 106.27624511718751], // 地图中心--银川
+        // center: [108.953939, 34.266611], // 地图中心--陕西
+        // center: [109.470962, 34.520632], // 地图中心--渭南
+        zoom: 17, //缩放比列
+        zoomControl: false, //禁用 + - 按钮
+        doubleClickZoom: true, // 禁用双击放大
+        attributionControl: false, // 移除右下角leaflet标识
+        preferCanvas: true,
+        contextmenu: true,
+        contextmenuWidth: 140,
+        // contextmenuItems: [{
+        //         text: "功率曲线拟合分析",
+        //         callback: this.powerLine,
+        //     },
+        //     {
+        //         text: "对风偏差分析",
+        //         callback: this.windAny,
+        //     },
+        //     {
+        //         text: "曲线偏差率分析",
+        //         callback: this.qxAny,
+        //     },
+        //     {
+        //         text: "温度与功率分析",
+        //         callback: this.wdyglAny,
+        //     },
+        //     {
+        //         text: "损失电量分析",
+        //         callback: this.ssdlAny,
+        //     },
+        //     {
+        //         text: "桨距角分析",
+        //         callback: this.jjjAny,
+        //     },
+        // ],
+      });
+      // let name = L.tileLayer(
+      //   "http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}"
+      // ).addTo(this.map);
+
+      let name = L.tileLayer(this.tilsUrl, {
+        minZoom: 6,
+        maxZoom: 17,
+      }).addTo(this.map);
+
+      // this.setAreaLayer("db", true);
+      // this.setAreaLayer("jb", true);
+      this.setAreaLayer("nx", true);
+    },
+
+    async funStationPos(ids) {
+      let res = null;
+      this.rightObj = {};
+      if (ids.length > 0) {
+        res = await httpRequest.get("/base/windturbine", {
+          params: {
+            wpids: this.ids.join(","),
+          },
+        });
+      } else {
+        // res = await httpRequest.get("/base/station", {
+        //     params: {},
+        // });
+        tabStr = "station";
+        let datas = await httpRequest.get(
+          "/benchmarking/wpByCplist?companyids=NX_FGS&type=-1"
+        );
+        res = datas.data;
+      }
+
+      if (res.code === 200) {
+        if (res.data && res.data.data && res.data.data.length) {
+          // 清除现有的 layers
+          this.layers.forEach((layer) => {
+            this.map.removeLayer(layer);
+          });
+          this.layers = [];
+
+          const viewCenter =
+            this.viewCenterMap[res.data.data[0].windpowerstationId] || null;
+
+          if (!this.ciLayer) {
+            this.ciLayer = L.canvasIconLayer({}).addTo(this.map);
+          } else {
+            this.ciLayer.clearLayers();
+          }
+
+          //   let iconUrl = require(`@/assets/images/indexCom/run_Icon.gif`);
+          let iconUrl = require(`@/assets/images/indexCom/fengji.png`);
+          // const img = new Image();
+          // img.src = require("@/assets/images/indexCom/run_Icon.gif");
+
+          for (let i = 0; i < res.data.data.length; i++) {
+            let item = res.data.data[i];
+
+            let marker = L.marker(
+              [Number(item.latitude), Number(item.longitude)],
+              {
+                icon: L.divIcon(
+                  {
+                    className: "iconSty",
+                    iconUrl: iconUrl,
+                    iconSize: [30, 39],
+                    // iconAnchor: [15, 12.5],
+                    iconAnchor: [15, 39],
+                  }
+                  // {
+                  //   className: "currentMapIcon",
+                  //   html: `<img src="${img.src}" style="width: 30px; height: 39px;">`,
+                  //   iconSize: [30, 39],
+                  //   iconAnchor: [15, 12.5],
+                  // }
+                ),
+                data: item,
+              }
+            ).bindTooltip(
+              `
         <div class="tip-box-top">
             <div class="item">${item.aname}</div>
             <div class="item">经度:${item.latitude}°</div>
             <div class="item">纬度:${item.longitude}°</div>
             <div class="item">海拔高度:${item.spare3}m</div>
         </div>`
-                            );
-
-                            let latlng = L.latLng(
-                                Number(item.latitude),
-                                Number(item.longitude)
-                            );
-
-                            let c1 = L.circleMarker(latlng, {
-                                radius: 5,
-                                color: "transparent",
-                                labelStyle: {
-                                    text: item.aname,
-                                    scale: 1.2,
-                                    rotation: 0,
-                                    offsetY: 35,
-                                    fillStyle: "#fff",
-                                    zIndex: i,
-                                },
-                                data: item,
-                            }).addTo(this.map);
-
-                            marker.on("tooltipopen", (e) => {
-                                this.rightObj = item;
-                            });
-
-                            marker.addTo(this.map);
-
-                            this.layers.push(c1);
-                            this.layers.push(marker);
-
-                            this.ciLayer.addLayer(marker);
-                        }
-
-                        let center = this.map.getCenter();
-                        this.map.panTo([center.lat, center.lng], {
-                            animate: true
-                        });
-
-                        if (viewCenter) {
-                            this.map.setView(viewCenter, 13);
-                        } else if (this.layers.length > 0) {
-                            this.map.setView(this.layers[0].getLatLng(), 13);
-                        }
-                    }
-                }
-            },
-
-            async funStationPosLabel(ids) {
-                if (this.layers.length > 0) {
-                    for (var i = 0; i < this.layers.length; i++) {
-                        this.map.removeLayer(this.layers[i]);
-                    }
-                    this.layers = [];
-                }
-                let res = null;
-                if (ids.length > 0) {
-                    res = await httpRequest.get("/base/location", {
-                        params: {
-                            ids: this.ids.join(","),
-                        },
-                    });
-                } else {
-                    res = await httpRequest.get("/base/station", {
-                        params: {},
-                    });
-                }
-                if (res.code === 200) {
-                    if (res.data && res.data.length) {
-                        this.layers = [];
-                        const viewCenter =
-                            this.viewCenterMap[res.data[0].windpowerstationId] || null;
-                        for (let i = 0; i < res.data.length; i++) {
-                            let item = res.data[i];
-
-                            let latlng = L.latLng(
-                                Number(item.latitude),
-                                Number(item.longitude)
-                            );
-                            let c = L.circleMarker(latlng, {
-                                    radius: 5,
-                                    color: "#12e799",
-                                    labelStyle: {
-                                        text: item.aname,
-                                        scale: 1,
-                                        rotation: 0,
-                                        offsetY: 15,
-                                        fillStyle: "#000",
-                                        zIndex: i,
-                                    },
-                                    data: item,
-                                })
-                                .bindTooltip(
-                                    `
+            );
+
+            let latlng = L.latLng(
+              Number(item.latitude),
+              Number(item.longitude)
+            );
+
+            let c1 = L.circleMarker(latlng, {
+              radius: 5,
+              color: "transparent",
+              labelStyle: {
+                text: item.aname,
+                scale: 1.2,
+                rotation: 0,
+                offsetY: 20,
+                fillStyle: "#fff",
+                zIndex: i,
+              },
+              data: item,
+            }).addTo(this.map);
+
+            marker.on("tooltipopen", (e) => {
+              this.rightObj = item;
+            });
+
+            marker.addTo(this.map);
+
+            this.layers.push(c1);
+            this.layers.push(marker);
+
+            this.ciLayer.addLayer(marker);
+          }
+
+          const lineArray = [
+            [
+              // 35kV集电一线
+              "1101~1102",
+              "1103~1102",
+              "1102~1104",
+              "1104~1105",
+              "1106~1107",
+              "1107~1108",
+              "1108~1109",
+              "1109~1110",
+              "1110~1111",
+              "1111~1113",
+              "1113~1112",
+            ],
+            [
+              // 35kV集电二线
+              "1201~1202",
+              "1201~1203",
+              "1203~1204",
+              "1204~1205",
+              "1205~1206",
+              "1206~1207",
+              "1207~1208",
+              "1208~1209",
+              "1209~1210",
+              "1210~1211",
+              "1211~1212",
+            ],
+            [
+              // 35kV集电三线
+              "2308~2307",
+              "2307~2304",
+              "2304~2303",
+              "2303~2302",
+              "2302~2301",
+              "2301~2302",
+              "2302~2303",
+              "2303~2304",
+              "2307~2309",
+              "2309~2311",
+              "2311~2312",
+              "2312~2313",
+              "2313~2312",
+              "2312~2311",
+              "2309~2310",
+              "2310~2306",
+              "2306~2305",
+            ],
+            [
+              // 35kV集电四线
+              "2412~2411",
+              "2411~2410",
+              "2411~2409",
+              "2409~2408",
+              "2408~2407",
+              "2407~2402",
+              "2402~2401",
+              "2401~2402",
+              "2407~2403",
+              "2403~2404",
+              "2404~2405",
+              "2405~2406",
+            ],
+          ];
+          const lineColor = ["red", "blue", "orange", "#FF7F50"];
+
+          lineArray.forEach((pEle, pIndex) => {
+            let latlngs = [];
+            pEle.forEach((cEle) => {
+              const points = cEle.split("~");
+              const point1 =
+                res.data.data.find((wt) => {
+                  return wt.nemCode === points[0];
+                }) || null;
+              const point2 =
+                res.data.data.find((wt) => {
+                  return wt.nemCode === points[1];
+                }) || null;
+              if (point1 && point2) {
+                latlngs.push([point1.latitude, point1.longitude]);
+                latlngs.push([point2.latitude, point2.longitude]);
+              }
+            });
+            // 创建Polyline对象,并添加到地图
+            var polyline = L.polyline(latlngs, {
+              color: lineColor[pIndex],
+            }).addTo(this.map);
+
+            // 可选:设置地图视图以确保这条线在视野内
+            // map.fitBounds(polyline.getBounds());
+          });
+
+          let center = this.map.getCenter();
+          this.map.panTo([center.lat, center.lng], {
+            animate: true,
+          });
+
+          if (viewCenter) {
+            this.map.setView(viewCenter, 13);
+          } else if (this.layers.length > 0) {
+            this.map.setView(this.layers[0].getLatLng(), 13);
+          }
+        }
+      }
+    },
+
+    async funStationPosLabel(ids) {
+      if (this.layers.length > 0) {
+        for (var i = 0; i < this.layers.length; i++) {
+          this.map.removeLayer(this.layers[i]);
+        }
+        this.layers = [];
+      }
+      let res = null;
+      if (ids.length > 0) {
+        res = await httpRequest.get("/base/location", {
+          params: {
+            ids: this.ids.join(","),
+          },
+        });
+      } else {
+        res = await httpRequest.get("/base/station", {
+          params: {},
+        });
+      }
+      if (res.code === 200) {
+        if (res.data && res.data.length) {
+          this.layers = [];
+          const viewCenter =
+            this.viewCenterMap[res.data[0].windpowerstationId] || null;
+          for (let i = 0; i < res.data.length; i++) {
+            let item = res.data[i];
+
+            let latlng = L.latLng(
+              Number(item.latitude),
+              Number(item.longitude)
+            );
+            let c = L.circleMarker(latlng, {
+              radius: 5,
+              color: "#12e799",
+              labelStyle: {
+                text: item.aname,
+                scale: 1,
+                rotation: 0,
+                offsetY: 15,
+                fillStyle: "#000",
+                zIndex: i,
+              },
+              data: item,
+            })
+              .bindTooltip(
+                `
                                 <div class="tip-box-top">
                                     <div class="item">${item.aname}</div>
                                     <div class="item">经度:${item.latitude}°</div>
                                     <div class="item">纬度:${item.longitude}°</div>
                                     <div class="item">海拔高度:${item.spare3}m</div>
                                 </div>`
-                                )
-                                .addTo(this.map);
-                            this.layers.push(c);
-
-                            let that = this;
-                            c.on("mouseover", function onmouseover(e) {
-                                that.rightObj = item;
-                            });
-                        }
-                        let center = this.map.getCenter();
-                        this.map.panTo([center.lat, center.lng], {
-                            animate: true,
-                        });
-                        this.map.setView(viewCenter || this.layers[0].getLatLng(), 13);
-                    }
-                }
-            },
-
-            setAreaLayer(jsonName, isBounds) {
-                const wfAllGeoJson = require(`@/assets/${jsonName}.json`);
-                this.areaLayer = L.geoJSON(wfAllGeoJson, {
-                    style: (feature) => {
-                        return {
-                            fillOpacity: 0.1,
-                            fillColor: "rgb(27, 242, 245)",
-                            weight: 2,
-                            color: "rgb(27, 242, 245)",
-                        };
-                    },
-                });
-                this.map.addLayer(this.areaLayer);
-                if (isBounds) {
-                    this.map.fitBounds(this.areaLayer.getBounds());
-                }
-            },
-
-            powerLine(e) {
-                if (!this.rightObj.latitude && !this.rightObj.longitude) {
-                    this.$message({
-                        message: "该坐标系下暂无功率曲线拟合",
-                        type: "error",
-                    });
-                } else {
-                    this.layers.forEach((item, index) => {
-                        if (item.options.data) {
-                            if (item.options.data.name.indexOf("风电场") === -1) {
-                                if (
-                                    item.options.data.latitude === this.rightObj.latitude &&
-                                    item.options.data.longitude === this.rightObj.longitude
-                                ) {
-                                    this.$emit("rightClick", {
-                                        menuIndex: 0,
-                                        current: this.rightObj,
-                                    });
-                                }
-                            } else {
-                                if (item.options.data.name === this.rightObj.name) {
-                                    this.$message({
-                                        message: "风场暂无功率曲线拟合功能",
-                                        type: "error",
-                                    });
-                                }
-                            }
-                        }
-                    });
-                }
-            },
-
-            windAny(e) {
-                if (!this.rightObj.latitude && !this.rightObj.longitude) {
-                    this.$message({
-                        message: "该坐标系下暂无对风偏差分析",
-                        type: "error",
-                    });
-                } else {
-                    this.layers.forEach((item) => {
-                        if (item.options.data) {
-                            if (item.options.data.name.indexOf("风电场") === -1) {
-                                if (
-                                    item.options.data.latitude === this.rightObj.latitude &&
-                                    item.options.data.longitude === this.rightObj.longitude
-                                ) {
-                                    this.$emit("rightClick", {
-                                        menuIndex: 1,
-                                        current: this.rightObj,
-                                    });
-                                }
-                            } else {
-                                if (item.options.data.name === this.rightObj.name) {
-                                    this.$message({
-                                        message: "风场暂无对风偏差分析功能",
-                                        type: "error",
-                                    });
-                                }
-                            }
-                        }
-                    });
-                }
-            },
-
-            qxAny(e) {
-                if (!this.rightObj.latitude && !this.rightObj.longitude) {
-                    this.$message({
-                        message: "该坐标系下暂无曲线偏差分析",
-                        type: "error",
-                    });
-                } else {
-                    this.layers.forEach((item) => {
-                        if (item.options.data) {
-                            if (item.options.data.name.indexOf("风电场") === -1) {
-                                if (
-                                    item.options.data.latitude === this.rightObj.latitude &&
-                                    item.options.data.longitude === this.rightObj.longitude
-                                ) {
-                                    this.$emit("rightClick", {
-                                        menuIndex: 2,
-                                        current: this.rightObj,
-                                    });
-                                }
-                            } else {
-                                if (item.options.data.name === this.rightObj.name) {
-                                    this.$message({
-                                        message: "风场暂无曲线偏差分析功能",
-                                        type: "error",
-                                    });
-                                }
-                            }
-                        }
-                    });
-                }
-            },
-
-            wdyglAny(e) {
-                if (!this.rightObj.latitude && !this.rightObj.longitude) {
-                    this.$message({
-                        message: "该坐标系下暂无温度与功率分析",
-                        type: "error",
-                    });
-                } else {
-                    this.layers.forEach((item) => {
-                        if (item.options.data) {
-                            if (item.options.data.name.indexOf("风电场") === -1) {
-                                if (
-                                    item.options.data.latitude === this.rightObj.latitude &&
-                                    item.options.data.longitude === this.rightObj.longitude
-                                ) {
-                                    this.$emit("rightClick", {
-                                        menuIndex: 3,
-                                        current: this.rightObj,
-                                    });
-                                }
-                            } else {
-                                if (item.options.data.name === this.rightObj.name) {
-                                    this.$message({
-                                        message: "风场暂无温度与功率分析功能",
-                                        type: "error",
-                                    });
-                                }
-                            }
-                        }
-                    });
-                }
-            },
-
-            ssdlAny(e) {
-                if (!this.rightObj.latitude && !this.rightObj.longitude) {
-                    this.$message({
-                        message: "该坐标系下暂无损失电量分析",
-                        type: "error",
-                    });
-                } else {
-                    this.layers.forEach((item) => {
-                        if (item.options.data) {
-                            if (item.options.data.name.indexOf("风电场") === -1) {
-                                if (
-                                    item.options.data.latitude === this.rightObj.latitude &&
-                                    item.options.data.longitude === this.rightObj.longitude
-                                ) {
-                                    this.$emit("rightClick", {
-                                        menuIndex: 4,
-                                        current: this.rightObj,
-                                    });
-                                }
-                            } else {
-                                if (item.options.data.name === this.rightObj.name) {
-                                    this.$message({
-                                        message: "风场暂无损失电量分析功能",
-                                        type: "error",
-                                    });
-                                }
-                            }
-                        }
-                    });
-                }
-            },
-
-            jjjAny(e) {
-                if (!this.rightObj.latitude && !this.rightObj.longitude) {
-                    this.$message({
-                        message: "该坐标系下暂无桨距角分析",
-                        type: "error",
-                    });
-                } else {
-                    this.layers.forEach((item) => {
-                        if (item.options.data) {
-                            if (item.options.data.name.indexOf("风电场") === -1) {
-                                if (
-                                    item.options.data.latitude === this.rightObj.latitude &&
-                                    item.options.data.longitude === this.rightObj.longitude
-                                ) {
-                                    this.$emit("rightClick", {
-                                        menuIndex: 5,
-                                        current: this.rightObj,
-                                    });
-                                }
-                            } else {
-                                if (item.options.data.name === this.rightObj.name) {
-                                    this.$message({
-                                        message: "风场暂无桨距角分析功能",
-                                        type: "error",
-                                    });
-                                }
-                            }
-                        }
-                    });
-                }
-            },
+              )
+              .addTo(this.map);
+            this.layers.push(c);
+
+            let that = this;
+            c.on("mouseover", function onmouseover(e) {
+              that.rightObj = item;
+            });
+          }
+          let center = this.map.getCenter();
+          this.map.panTo([center.lat, center.lng], {
+            animate: true,
+          });
+          this.map.setView(viewCenter || this.layers[0].getLatLng(), 13);
+        }
+      }
+    },
+
+    setAreaLayer(jsonName, isBounds) {
+      const wfAllGeoJson = require(`@/assets/${jsonName}.json`);
+      this.areaLayer = L.geoJSON(wfAllGeoJson, {
+        style: (feature) => {
+          return {
+            fillOpacity: 0.1,
+            fillColor: "rgb(27, 242, 245)",
+            weight: 2,
+            color: "rgb(27, 242, 245)",
+          };
         },
-    };
+      });
+      this.map.addLayer(this.areaLayer);
+      if (isBounds) {
+        this.map.fitBounds(this.areaLayer.getBounds());
+      }
+    },
+
+    powerLine(e) {
+      if (!this.rightObj.latitude && !this.rightObj.longitude) {
+        this.$message({
+          message: "该坐标系下暂无功率曲线拟合",
+          type: "error",
+        });
+      } else {
+        this.layers.forEach((item, index) => {
+          if (item.options.data) {
+            if (item.options.data.name.indexOf("风电场") === -1) {
+              if (
+                item.options.data.latitude === this.rightObj.latitude &&
+                item.options.data.longitude === this.rightObj.longitude
+              ) {
+                this.$emit("rightClick", {
+                  menuIndex: 0,
+                  current: this.rightObj,
+                });
+              }
+            } else {
+              if (item.options.data.name === this.rightObj.name) {
+                this.$message({
+                  message: "风场暂无功率曲线拟合功能",
+                  type: "error",
+                });
+              }
+            }
+          }
+        });
+      }
+    },
+
+    windAny(e) {
+      if (!this.rightObj.latitude && !this.rightObj.longitude) {
+        this.$message({
+          message: "该坐标系下暂无对风偏差分析",
+          type: "error",
+        });
+      } else {
+        this.layers.forEach((item) => {
+          if (item.options.data) {
+            if (item.options.data.name.indexOf("风电场") === -1) {
+              if (
+                item.options.data.latitude === this.rightObj.latitude &&
+                item.options.data.longitude === this.rightObj.longitude
+              ) {
+                this.$emit("rightClick", {
+                  menuIndex: 1,
+                  current: this.rightObj,
+                });
+              }
+            } else {
+              if (item.options.data.name === this.rightObj.name) {
+                this.$message({
+                  message: "风场暂无对风偏差分析功能",
+                  type: "error",
+                });
+              }
+            }
+          }
+        });
+      }
+    },
+
+    qxAny(e) {
+      if (!this.rightObj.latitude && !this.rightObj.longitude) {
+        this.$message({
+          message: "该坐标系下暂无曲线偏差分析",
+          type: "error",
+        });
+      } else {
+        this.layers.forEach((item) => {
+          if (item.options.data) {
+            if (item.options.data.name.indexOf("风电场") === -1) {
+              if (
+                item.options.data.latitude === this.rightObj.latitude &&
+                item.options.data.longitude === this.rightObj.longitude
+              ) {
+                this.$emit("rightClick", {
+                  menuIndex: 2,
+                  current: this.rightObj,
+                });
+              }
+            } else {
+              if (item.options.data.name === this.rightObj.name) {
+                this.$message({
+                  message: "风场暂无曲线偏差分析功能",
+                  type: "error",
+                });
+              }
+            }
+          }
+        });
+      }
+    },
+
+    wdyglAny(e) {
+      if (!this.rightObj.latitude && !this.rightObj.longitude) {
+        this.$message({
+          message: "该坐标系下暂无温度与功率分析",
+          type: "error",
+        });
+      } else {
+        this.layers.forEach((item) => {
+          if (item.options.data) {
+            if (item.options.data.name.indexOf("风电场") === -1) {
+              if (
+                item.options.data.latitude === this.rightObj.latitude &&
+                item.options.data.longitude === this.rightObj.longitude
+              ) {
+                this.$emit("rightClick", {
+                  menuIndex: 3,
+                  current: this.rightObj,
+                });
+              }
+            } else {
+              if (item.options.data.name === this.rightObj.name) {
+                this.$message({
+                  message: "风场暂无温度与功率分析功能",
+                  type: "error",
+                });
+              }
+            }
+          }
+        });
+      }
+    },
+
+    ssdlAny(e) {
+      if (!this.rightObj.latitude && !this.rightObj.longitude) {
+        this.$message({
+          message: "该坐标系下暂无损失电量分析",
+          type: "error",
+        });
+      } else {
+        this.layers.forEach((item) => {
+          if (item.options.data) {
+            if (item.options.data.name.indexOf("风电场") === -1) {
+              if (
+                item.options.data.latitude === this.rightObj.latitude &&
+                item.options.data.longitude === this.rightObj.longitude
+              ) {
+                this.$emit("rightClick", {
+                  menuIndex: 4,
+                  current: this.rightObj,
+                });
+              }
+            } else {
+              if (item.options.data.name === this.rightObj.name) {
+                this.$message({
+                  message: "风场暂无损失电量分析功能",
+                  type: "error",
+                });
+              }
+            }
+          }
+        });
+      }
+    },
+
+    jjjAny(e) {
+      if (!this.rightObj.latitude && !this.rightObj.longitude) {
+        this.$message({
+          message: "该坐标系下暂无桨距角分析",
+          type: "error",
+        });
+      } else {
+        this.layers.forEach((item) => {
+          if (item.options.data) {
+            if (item.options.data.name.indexOf("风电场") === -1) {
+              if (
+                item.options.data.latitude === this.rightObj.latitude &&
+                item.options.data.longitude === this.rightObj.longitude
+              ) {
+                this.$emit("rightClick", {
+                  menuIndex: 5,
+                  current: this.rightObj,
+                });
+              }
+            } else {
+              if (item.options.data.name === this.rightObj.name) {
+                this.$message({
+                  message: "风场暂无桨距角分析功能",
+                  type: "error",
+                });
+              }
+            }
+          }
+        });
+      }
+    },
+  },
+};
 </script>
 <style scoped lang="less">
-    .mapCom {
-        height: 100%;
-
-        .iconLabel {
-            width: 80px !important;
-        }
-
-        .iconSty {
-            .iconStyClass {
-                width: 50px;
-                height: 100px;
-                position: relative;
-                top: 40px;
-            }
-        }
-    }
-
-    #map {
-        width: 100%;
-        height: 100%;
-    }
-
-    .lmap-image {
-        width: 32px;
-        height: 32px;
-    }
-
-    .lmap-span {
-        display: inline-block;
-        margin-left: 5px;
-        padding: 5px;
-        font-weight: bold;
-        line-height: 20px;
-        font-size: 14px;
-        color: #fff;
-        white-space: nowrap;
-    }
-
-    .lmap-text {
-        display: inline-block;
-        margin-left: 5px;
-        padding: 5px;
-        font-weight: bold;
-        line-height: 20px;
-        font-size: 16px;
-        color: #fff;
-        width: 500px;
-        white-space: nowrap;
-        position: absolute;
-        text-align: center;
-        top: 25px;
-        left: -250px;
+.mapCom {
+  height: 100%;
+
+  .iconLabel {
+    width: 80px !important;
+  }
+
+  .iconSty {
+    .iconStyClass {
+      width: 50px;
+      height: 100px;
+      position: relative;
+      top: 40px;
     }
+  }
+}
+
+#map {
+  width: 100%;
+  height: 100%;
+}
+
+.lmap-image {
+  width: 32px;
+  height: 32px;
+}
+
+.lmap-span {
+  display: inline-block;
+  margin-left: 5px;
+  padding: 5px;
+  font-weight: bold;
+  line-height: 20px;
+  font-size: 14px;
+  color: #fff;
+  white-space: nowrap;
+}
+
+.lmap-text {
+  display: inline-block;
+  margin-left: 5px;
+  padding: 5px;
+  font-weight: bold;
+  line-height: 20px;
+  font-size: 16px;
+  color: #fff;
+  width: 500px;
+  white-space: nowrap;
+  position: absolute;
+  text-align: center;
+  top: 25px;
+  left: -250px;
+}
 </style>
 <style lang="less">
-    .mapCom {
-        .currentMapIcon {
-            img {
-                position: absolute;
-                z-index: 1000;
-            }
-        }
+.mapCom {
+  .currentMapIcon {
+    img {
+      position: absolute;
+      z-index: 1000;
     }
+  }
+}
 </style>