From d277d770292df0a1266c07f4773d62edd70e6515 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期一, 13 五月 2024 17:59:16 +0800
Subject: [PATCH] 新增场景标注

---
 src/assets/mipmap/scene_17.png           |    0 
 src/constant/scene-types.js              |  110 +++++++++
 src/assets/mipmap/scene_4.png            |    0 
 src/utils/map/util.js                    |    9 
 src/utils/map/animation.js               |    4 
 src/model/FactorDatas.js                 |    8 
 src/assets/mipmap/scene_15.png           |    0 
 src/components.d.ts                      |    9 
 src/utils/map/calculate.js               |   95 +++++++
 src/views/HomePage.vue                   |    2 
 src/views/realtimemode/RealtimeMode.vue  |    1 
 src/assets/mipmap/scene_6.png            |    0 
 src/utils/map/marks.js                   |   61 +++++
 src/components/map/MapScene.vue          |  122 ++++++++++
 src/assets/mipmap/scene_5.png            |    0 
 src/assets/mipmap/scene_18.png           |    0 
 src/utils/map/index_old.js               |    2 
 src/api/index.js                         |    4 
 src/assets/mipmap/scene_16.png           |    0 
 index.html                               |    2 
 src/components/search/OptionLocation.vue |   47 +++
 src/components/map/MapLocation.vue       |  190 +++++++++++++++
 src/api/sceneInfoApi.js                  |   14 +
 src/assets/mipmap/scene_1.png            |    0 
 24 files changed, 661 insertions(+), 19 deletions(-)

diff --git a/index.html b/index.html
index fc727ed..630476d 100644
--- a/index.html
+++ b/index.html
@@ -10,7 +10,7 @@
     <div id="app"></div>
     <script
       type="text/javascript"
-      src="https://webapi.amap.com/maps?v=1.4.5&key=c55f27799afbfa69dc5a3fad90cafe51&plugin=Map3D,ElasticMarker,AMap.ControlBar"
+      src="https://webapi.amap.com/maps?v=1.4.5&key=c55f27799afbfa69dc5a3fad90cafe51&plugin=Map3D,ElasticMarker,AMap.ControlBar,AMap.Geocoder"
     ></script>
     <script src="/src/lib/jquery-3.5.1.min.js"></script>
     <script type="module" src="/src/main.js"></script>
diff --git a/src/api/index.js b/src/api/index.js
index 21205a1..4c084fe 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -1,13 +1,13 @@
 import axios from 'axios';
 import { ElMessage } from 'element-plus';
 
-const debug = false;
+const debug = true;
 
 let ip1 = 'http://114.215.109.124:8805/';
 // let ip1 = 'http://47.100.191.150:9029/';
 
 if (debug) {
-  ip1 = 'http://192.168.0.138:8082/';
+  ip1 = 'http://192.168.0.138:8084/';
 }
 
 const $http = axios.create({
diff --git a/src/api/sceneInfoApi.js b/src/api/sceneInfoApi.js
new file mode 100644
index 0000000..56cbbc6
--- /dev/null
+++ b/src/api/sceneInfoApi.js
@@ -0,0 +1,14 @@
+import { $http } from './index';
+
+/**
+ *
+ */
+export default {
+  searchScene(area) {
+    return $http.post(`scene/find`, area).then((res) => res.data);
+  }
+
+  // searchByCoordinate({lng, lat, radius}) {
+  //   return $http.post(`scene/find/radius`, mission).then((res) => res.data);
+  // },
+};
diff --git a/src/assets/mipmap/scene_1.png b/src/assets/mipmap/scene_1.png
new file mode 100644
index 0000000..972dd1c
--- /dev/null
+++ b/src/assets/mipmap/scene_1.png
Binary files differ
diff --git a/src/assets/mipmap/scene_15.png b/src/assets/mipmap/scene_15.png
new file mode 100644
index 0000000..2c33b51
--- /dev/null
+++ b/src/assets/mipmap/scene_15.png
Binary files differ
diff --git a/src/assets/mipmap/scene_16.png b/src/assets/mipmap/scene_16.png
new file mode 100644
index 0000000..f314fcd
--- /dev/null
+++ b/src/assets/mipmap/scene_16.png
Binary files differ
diff --git a/src/assets/mipmap/scene_17.png b/src/assets/mipmap/scene_17.png
new file mode 100644
index 0000000..082f2ac
--- /dev/null
+++ b/src/assets/mipmap/scene_17.png
Binary files differ
diff --git a/src/assets/mipmap/scene_18.png b/src/assets/mipmap/scene_18.png
new file mode 100644
index 0000000..4adcc68
--- /dev/null
+++ b/src/assets/mipmap/scene_18.png
Binary files differ
diff --git a/src/assets/mipmap/scene_4.png b/src/assets/mipmap/scene_4.png
new file mode 100644
index 0000000..5d4a940
--- /dev/null
+++ b/src/assets/mipmap/scene_4.png
Binary files differ
diff --git a/src/assets/mipmap/scene_5.png b/src/assets/mipmap/scene_5.png
new file mode 100644
index 0000000..c90e6a7
--- /dev/null
+++ b/src/assets/mipmap/scene_5.png
Binary files differ
diff --git a/src/assets/mipmap/scene_6.png b/src/assets/mipmap/scene_6.png
new file mode 100644
index 0000000..6f7ab7a
--- /dev/null
+++ b/src/assets/mipmap/scene_6.png
Binary files differ
diff --git a/src/components.d.ts b/src/components.d.ts
index c38709b..5d5fb4f 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -11,8 +11,7 @@
     BaseMap: typeof import('./components/map/BaseMap.vue')['default']
     CardButton: typeof import('./components/CardButton.vue')['default']
     CardDialog: typeof import('./components/CardDialog.vue')['default']
-    cop: typeof import('./components/monitor/WeatherData.vue')['default']
-    copy: typeof import('./components/monitor/WeatherData.vue')['default']
+    copy: typeof import('./components/search/OptionType copy.vue')['default']
     CoreHeader: typeof import('./components/core/CoreHeader.vue')['default']
     CoreMenu: typeof import('./components/core/CoreMenu.vue')['default']
     DataSummary: typeof import('./components/monitor/DataSummary.vue')['default']
@@ -30,8 +29,10 @@
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElInput: typeof import('element-plus/es')['ElInput']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
     ElRadio: typeof import('element-plus/es')['ElRadio']
     ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
@@ -47,11 +48,14 @@
     FactorTrend: typeof import('./components/monitor/FactorTrend.vue')['default']
     GaugeChart: typeof import('./components/chart/GaugeChart.vue')['default']
     HistoricalTrajectory: typeof import('./components/animation/HistoricalTrajectory.vue')['default']
+    MapLocation: typeof import('./components/map/MapLocation.vue')['default']
+    MapScene: typeof import('./components/map/MapScene.vue')['default']
     MapToolbox: typeof import('./components/map/MapToolbox.vue')['default']
     MIssionCreate: typeof import('./components/mission/MIssionCreate.vue')['default']
     MissionImport: typeof import('./components/mission/MissionImport.vue')['default']
     MissionManage: typeof import('./components/mission/MissionManage.vue')['default']
     OptionDevice: typeof import('./components/search/OptionDevice.vue')['default']
+    OptionLocation: typeof import('./components/search/OptionLocation.vue')['default']
     OptionMission: typeof import('./components/search/OptionMission.vue')['default']
     OptionTime: typeof import('./components/search/OptionTime.vue')['default']
     OptionType: typeof import('./components/search/OptionType.vue')['default']
@@ -64,7 +68,6 @@
     TrajectoryState: typeof import('./components/animation/TrajectoryState.vue')['default']
     VehicleData: typeof import('./components/monitor/VehicleData.vue')['default']
     WeatherData: typeof import('./components/monitor/WeatherData.vue')['default']
-    'WeatherData cop': typeof import('./components/monitor/WeatherData.vue')['default']
     WeatherDataCopy: typeof import('./components/monitor/WeatherData-copy.vue')['default']
   }
   export interface ComponentCustomProperties {
diff --git a/src/components/map/MapLocation.vue b/src/components/map/MapLocation.vue
new file mode 100644
index 0000000..dc0aae2
--- /dev/null
+++ b/src/components/map/MapLocation.vue
@@ -0,0 +1,190 @@
+<template>
+  <el-button
+    type="primary"
+    icon="Memo"
+    class="el-button-custom p-events-auto"
+    @click="dialogVisible = !dialogVisible"
+  >
+    鍦扮悊缂栫爜
+  </el-button>
+  <el-dialog v-model="dialogVisible" :show-close="false" align-center>
+    <template #header="{ close, titleId, titleClass }">
+      <BaseCard direction="top-left" borderless="t">
+        <template #content>
+          <el-row justify="space-between" align="middle">
+            <el-row align="middle">
+              <font-awesome-icon icon="fa fa-list" class="m-r-4" />
+              <span :id="titleId" :class="titleClass">鍦扮悊缂栫爜</span>
+            </el-row>
+            <font-awesome-icon
+              icon="fa fa-times"
+              class="cursor-p m-r-4"
+              @click="close"
+            />
+          </el-row>
+        </template>
+      </BaseCard>
+    </template>
+    <BaseCard size="medium">
+      <template #content>
+        <el-row class="mission-table">
+          <el-col :span="20">
+            <el-input
+              v-model="address"
+              :autosize="{ minRows: 2, maxRows: 4 }"
+              type="textarea"
+              placeholder="Please input"
+            />
+            <el-scrollbar height="calc(40vh - var(--bevel-length-2))">
+              <div v-for="item in location" :key="item.lng">
+                <span>{{ item.lng }}</span>
+                <span>,</span>
+                <span>{{ item.lat }}</span>
+                <!-- <span> | </span> -->
+                <!-- <span>{{ item.gpsLng }}</span>
+                <span>,</span>
+                <span>{{ item.gpsLat }}</span> -->
+                <span> | </span>
+                <span>{{ item.formattedAddress }}</span>
+                <!-- <span>{{ item.adcode }}</span> -->
+              </div>
+            </el-scrollbar>
+          </el-col>
+          <el-col :span="4" class="flex-col">
+            <div>
+              <el-button
+                type="primary"
+                class="el-button-custom"
+                @click="search"
+              >
+                鏌ヨ鍧愭爣
+              </el-button>
+            </div>
+            <div>
+              <el-button
+                type="primary"
+                class="el-button-custom"
+                @click="convert"
+              >
+                GPS杞珮寰峰潗鏍�
+              </el-button>
+            </div>
+          </el-col>
+        </el-row>
+      </template>
+    </BaseCard>
+  </el-dialog>
+</template>
+<script>
+import calculate from '../../utils/map/calculate';
+
+// eslint-disable-next-line no-undef
+const geocoder = new AMap.Geocoder({
+  // city 鎸囧畾杩涜缂栫爜鏌ヨ鐨勫煄甯傦紝鏀寔浼犲叆鍩庡競鍚嶃�乤dcode 鍜� citycode
+  city: '涓婃捣',
+  district: '闀垮畞鍖�'
+});
+
+export default {
+  props: {},
+  data() {
+    return {
+      dialogVisible: false,
+      address: '',
+      location: []
+    };
+  },
+  computed: {},
+  methods: {
+    search() {
+      if (this.address == '') return;
+      const addressList = this.address.split('\n');
+      const res = [];
+      geocoder.getLocation(addressList, (status, result) => {
+        if (status === 'complete' && result.info === 'OK') {
+          // const gdList = result.geocodes.map((v) => {
+          //   return [v.location.getLng(), v.location.getLat()];
+          // });
+          // calculate.convertFromGPS(gdList, (gd) => {
+
+          // });
+          for (let y = 0; y < result.geocodes.length; y++) {
+            const g = result.geocodes[y];
+            if (!g) continue;
+            const lng = g.location.getLng();
+            const lat = g.location.getLat();
+            const { formattedAddress, adcode, level } = g;
+            if (adcode == '310105') {
+              // const [gpsLng, gpsLat] = gd[i];
+              const findRes = res.find((v) => {
+                return v.formattedAddress == formattedAddress;
+              });
+              if (!findRes) {
+                for (let i = 0; i < addressList.length; i++) {
+                  const a = addressList[i];
+                  if (formattedAddress.match(a)) {
+                    res.push({
+                      lng,
+                      lat,
+                      // gpsLng,
+                      // gpsLat,
+                      formattedAddress,
+                      adcode,
+                      level
+                    });
+                    break;
+                  }
+                }
+              }
+            }
+          }
+          this.location = res;
+        }
+      });
+    },
+
+    convert() {
+      if (this.address == '') return;
+      const gpsList = this.address.split('\n').map((v) => {
+        return v.split(',');
+      });
+      calculate.convertFromGPS(
+        gpsList,
+        (gd) => {
+          this.location = gd.map((v) => {
+            return {
+              lng: v[0],
+              lat: v[1]
+            };
+          });
+        },
+        'baidu'
+      );
+    }
+  }
+};
+</script>
+<style>
+.el-dialog {
+  --el-dialog-bg-color: transparent !important;
+  --el-dialog-title-font-size: var(--el-font-size-medium);
+  --el-dialog-content-font-size: 14px;
+  --el-dialog-padding-primary: 0px !important;
+}
+
+.el-dialog__title {
+  color: var(--font-color);
+}
+</style>
+<style scoped>
+.flex-col {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  align-items: flex-end;
+}
+
+.mission-table {
+  height: 60vh;
+}
+</style>
diff --git a/src/components/map/MapScene.vue b/src/components/map/MapScene.vue
new file mode 100644
index 0000000..b230c8c
--- /dev/null
+++ b/src/components/map/MapScene.vue
@@ -0,0 +1,122 @@
+<template>
+  <el-popover placement="bottom" trigger="click">
+    <template #reference>
+      <el-button
+        type="primary"
+        icon="Memo"
+        class="el-button-custom p-events-auto"
+      >
+        鍦烘櫙鏍囨敞
+      </el-button>
+    </template>
+    <OptionLocation v-model="districtCode"></OptionLocation>
+    <div class="vertical-class">
+      <el-checkbox
+        :indeterminate="isIndeterminate"
+        v-model="checkAll"
+        @change="handelCheckAllChange"
+        >鍏ㄩ��</el-checkbox
+      >
+    </div>
+    <el-checkbox-group
+      v-model="selectType"
+      size="default"
+      @change="handleChange"
+    >
+      <div class="vertical-class">
+        <el-checkbox
+          v-for="item in options"
+          :key="item.label"
+          :value="item.value"
+          >{{ item.label }}</el-checkbox
+        >
+      </div>
+    </el-checkbox-group>
+  </el-popover>
+</template>
+
+<script>
+import { sceneTypes, sceneIcon } from '@/constant/scene-types';
+import sceneInfoApi from '@/api/sceneInfoApi';
+import marks from '@/utils/map/marks';
+import MapUtil from '@/utils/map/util';
+
+const lableMarkMap = new Map();
+
+export default {
+  data() {
+    return {
+      districtCode: '',
+      isIndeterminate: false,
+      checkAll: false,
+      selectType: [],
+      options: sceneTypes(),
+      sceneMap: new Map()
+    };
+  },
+  methods: {
+    fetchScene(sceneType) {
+      return sceneInfoApi
+        .searchScene({
+          districtCode: this.districtCode,
+          sceneTypeId: sceneType
+        })
+        .then((res) => {
+          return res.data;
+        });
+    },
+    handelCheckAllChange(val) {
+      this.selectType = val ? this.options.map((v) => v.value) : [];
+      this.isIndeterminate = false;
+      this.handleChange(this.selectType);
+    },
+    handleChange(types) {
+      // for (const iterator of lableMarkMap) {
+      //   MapUtil.removeViews(iterator[1]);
+      // }
+
+      let checkedCount = types.length;
+      this.checkAll = checkedCount === this.options.length;
+      this.isIndeterminate =
+        checkedCount > 0 && checkedCount < this.options.length;
+
+      // 鏍规嵁閫夐」锛屽皢鏈墦寮�鐨勫浘灞傚紑鍚�
+      types.forEach((t) => {
+        if (!lableMarkMap.has(t)) {
+          this.fetchScene(t).then((res) => {
+            const layer = marks.createLabelMarks(sceneIcon(t), res);
+            lableMarkMap.set(t, { show: true, layer });
+          });
+        } else {
+          const m = lableMarkMap.get(t);
+          if (!m.show) {
+            MapUtil.addViews(m.layer);
+            m.show = true;
+          }
+        }
+      });
+
+      // 鏍规嵁閫夐」锛屽皢寮�鍚腑鐨勬湭閫変腑鍥惧眰鍏抽棴
+      for (const [key, value] of lableMarkMap) {
+        if (!types.includes(key)) {
+          if (value.show) {
+            MapUtil.removeViews(value.layer);
+            value.show = false;
+          }
+        }
+      }
+      // MapUtil.setFitView();
+    }
+  }
+};
+</script>
+
+<style scoped>
+.el-button {
+  margin: initial !important;
+}
+.vertical-class {
+  display: flex;
+  flex-direction: column;
+}
+</style>
diff --git a/src/components/search/OptionLocation.vue b/src/components/search/OptionLocation.vue
new file mode 100644
index 0000000..71e5edc
--- /dev/null
+++ b/src/components/search/OptionLocation.vue
@@ -0,0 +1,47 @@
+<template>
+  <!-- <el-form-item label="鍖哄幙"> -->
+  <el-select
+    :model-value="modelValue"
+    @update:model-value="handleChange"
+    placeholder="鍖哄幙"
+    size="small"
+    class="w-80"
+  >
+    <el-option
+      v-for="(s, i) in typeList"
+      :key="i"
+      :label="s.label"
+      :value="s.value"
+    />
+  </el-select>
+  <!-- </el-form-item> -->
+</template>
+
+<script>
+export default {
+  props: {
+    modelValue: String
+  },
+  emits: ['update:modelValue'],
+  data() {
+    return {
+      typeList: [
+        {
+          label: '闀垮畞鍖�',
+          value: '310105'
+        }
+      ]
+    };
+  },
+  methods: {
+    handleChange(value) {
+      // todo 鏍规嵁璁惧绫诲瀷鍒囨崲鍦板浘杞藉叿鐨勫浘鏍囥��
+      this.$emit('update:modelValue', value);
+    }
+  },
+  mounted() {
+    this.handleChange(this.typeList[0].value);
+  }
+};
+</script>
+<style scoped></style>
diff --git a/src/constant/scene-types.js b/src/constant/scene-types.js
new file mode 100644
index 0000000..cffdfe7
--- /dev/null
+++ b/src/constant/scene-types.js
@@ -0,0 +1,110 @@
+import scene_1 from '@/assets/mipmap/scene_1.png';
+import scene_4 from '@/assets/mipmap/scene_4.png';
+import scene_5 from '@/assets/mipmap/scene_5.png';
+import scene_6 from '@/assets/mipmap/scene_6.png';
+import scene_15 from '@/assets/mipmap/scene_15.png';
+import scene_16 from '@/assets/mipmap/scene_16.png';
+import scene_17 from '@/assets/mipmap/scene_17.png';
+import scene_18 from '@/assets/mipmap/scene_18.png';
+
+function sceneTypes() {
+  return [
+    {
+      label: '宸ュ湴',
+      value: '1'
+    },
+    // {
+    //   label: '鐮佸ご',
+    //   value: '2',
+    // },
+    // {
+    //   label: '鎼呮媽绔�',
+    //   value: '3',
+    // },
+    {
+      label: '宸ヤ笟浼佷笟',
+      value: '4'
+    },
+    {
+      label: '椁愰ギ',
+      value: '5'
+    },
+    {
+      label: '姹戒慨',
+      value: '6'
+    },
+    // {
+    //   label: '闄嶅皹鐐�',
+    //   value: '7',
+    // },
+    // {
+    //   label: '绌烘皵璐ㄩ噺鐩戞祴鐐�',
+    //   value: '8',
+    // },
+    // {
+    //   label: '閬撹矾鎵皹鐩戞祴鐐�',
+    //   value: '9',
+    // },
+    // {
+    //   label: '閬撹矾',
+    //   value: '10',
+    // },
+    // {
+    //   label: '娌虫祦鏂潰',
+    //   value: '11',
+    // },
+    // {
+    //   label: '宸ヤ笟鍥尯',
+    //   value: '12',
+    // },
+    // {
+    //   label: '鏃犲浐瀹氬満鏅�',
+    //   value: '13',
+    // },
+    // {
+    //   label: '鍫嗗満',
+    //   value: '14',
+    // },
+    {
+      label: '瀹為獙瀹�',
+      value: '15'
+    },
+    {
+      label: '绮惧搧灏忓尯',
+      value: '16'
+    },
+    {
+      label: '鍔犳补绔�',
+      value: '17'
+    },
+    {
+      label: '鍟嗕笟浣�',
+      value: '18'
+    }
+  ];
+}
+
+function sceneIcon(type) {
+  switch (type) {
+    case '1':
+      return scene_1;
+    case '4':
+      return scene_4;
+    case '5':
+      return scene_5;
+    case '6':
+      return scene_6;
+    case '15':
+      return scene_15;
+    case '16':
+      return scene_16;
+    case '17':
+      return scene_17;
+    case '18':
+      return scene_18;
+    default:
+      return scene_1;
+  }
+}
+
+export { sceneTypes, sceneIcon };
diff --git a/src/model/FactorDatas.js b/src/model/FactorDatas.js
index b6b1d30..58bc5a8 100644
--- a/src/model/FactorDatas.js
+++ b/src/model/FactorDatas.js
@@ -1,5 +1,5 @@
-import { Factor } from "./Factor";
-import calculate from "@/utils/map/calculate";
+import { Factor } from './Factor';
+import calculate from '@/utils/map/calculate';
 
 /**
  *
@@ -61,8 +61,6 @@
         f.pushData(v, drawMode == undefined ? 0 : drawMode);
       });
     });
-
-    
 
     this.convertGPS(this.lnglats_GPS, callback);
   },
@@ -162,7 +160,7 @@
   // 鑾峰彇鏁版嵁闀垮害
   length: function () {
     return this.lnglats_GD.length;
-  },
+  }
 };
 
 export { FactorDatas };
diff --git a/src/utils/map/animation.js b/src/utils/map/animation.js
index 40fbec8..ed664c3 100644
--- a/src/utils/map/animation.js
+++ b/src/utils/map/animation.js
@@ -245,11 +245,11 @@
     // this.OnEachFrameCallback = undefined;
     // this.OnEachTaskEndCallback = undefined;
     this.frameAnimation.stop();
+    this._clearMap();
   },
   setOnStopCallback: function (callback) {
     this.frameAnimation.setOnStopCallback(
       function () {
-        this._clearMap();
         callback();
       }.bind(this)
     );
@@ -419,6 +419,6 @@
 };
 
 const realTimeMapAnimation = new MapAnimation();
-realTimeMapAnimation.clear = false;
+// realTimeMapAnimation.clear = false;
 
 export { realTimeMapAnimation, MapAnimation };
diff --git a/src/utils/map/calculate.js b/src/utils/map/calculate.js
index 505d082..b9ad407 100644
--- a/src/utils/map/calculate.js
+++ b/src/utils/map/calculate.js
@@ -30,19 +30,82 @@
   return path;
 }
 
+//瀹氫箟涓�浜涘父閲�
+const PI = 3.1415926535897932384626;
+const a = 6378245.0; //闀垮崐杞�
+const ee = 0.00669342162296594323; //鎵佺巼/*** GCJ02 杞崲涓� WGS84* @param lng* @param lat* @returns {*[]}*/
+
+/**
+ * 鍒ゆ柇鏄惁鍦ㄥ浗鍐咃紝涓嶅湪鍥藉唴鍒欎笉鍋氬亸绉�
+ * @param lng
+ * @param lat
+ * @returns {boolean}
+ */
+function out_of_china(lng, lat) {
+  // 绾害3.86~53.55,缁忓害73.66~135.05
+  return !(lng > 73.66 && lng < 135.05 && lat > 3.86 && lat < 53.55);
+}
+
+function transformlat(lng, lat) {
+  // lat = +lat lng = +lng
+  let ret =
+    -100.0 +
+    2.0 * lng +
+    3.0 * lat +
+    0.2 * lat * lat +
+    0.1 * lng * lat +
+    0.2 * Math.sqrt(Math.abs(lng));
+  ret +=
+    ((20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) *
+      2.0) /
+    3.0;
+  ret +=
+    ((20.0 * Math.sin(lat * PI) + 40.0 * Math.sin((lat / 3.0) * PI)) * 2.0) /
+    3.0;
+  ret +=
+    ((160.0 * Math.sin((lat / 12.0) * PI) + 320 * Math.sin((lat * PI) / 30.0)) *
+      2.0) /
+    3.0;
+  return ret;
+}
+
+function transformlng(lng, lat) {
+  // lat = +latlng = +lng
+  let ret =
+    300.0 +
+    lng +
+    2.0 * lat +
+    0.1 * lng * lng +
+    0.1 * lng * lat +
+    0.1 * Math.sqrt(Math.abs(lng));
+  ret +=
+    ((20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) *
+      2.0) /
+    3.0;
+  ret +=
+    ((20.0 * Math.sin(lng * PI) + 40.0 * Math.sin((lng / 3.0) * PI)) * 2.0) /
+    3.0;
+  ret +=
+    ((150.0 * Math.sin((lng / 12.0) * PI) +
+      300.0 * Math.sin((lng / 30.0) * PI)) *
+      2.0) /
+    3.0;
+  return ret;
+}
+
 /**
  * 灏唃ps缁忕含搴﹁浆鎹负楂樺痉鍦板浘缁忕含搴�
  * @param {*} lnglats
  * @param {*} callback
  */
-function _convertLatlng(index, coor, lnglats, callback) {
+function _convertLatlng(index, coor, lnglats, type = 'gps', callback) {
   if (index < coor.length) {
     var path = parse2LngLat(coor[index]);
     // eslint-disable-next-line no-undef
-    AMap.convertFrom(path, 'gps', function (status, result) {
+    AMap.convertFrom(path, type, function (status, result) {
       if (result.info === 'ok') {
         lnglats.push.apply(lnglats, result.locations);
-        _convertLatlng(index + 1, coor, lnglats, callback);
+        _convertLatlng(index + 1, coor, lnglats, type, callback);
       }
     });
   } else {
@@ -103,14 +166,36 @@
     return coors_GD;
   },
 
-  convertFromGPS: function (gps, callback) {
+  convertFromGPS: function (gps, callback, type = 'gps') {
     var coor = _prepare4convert(gps);
-    _convertLatlng(0, coor, [], function (result) {
+    _convertLatlng(0, coor, [], type, function (result) {
       var gd = [];
       result.forEach((r) => {
         gd.push([r.lng, r.lat]);
       });
       callback(gd);
     });
+  },
+
+  /**
+   * 楂樺痉鍦板浘鍧愭爣杞珿PS鍧愭爣绠楁硶
+   */
+  gcj02towgs84(lng, lat) {
+    // lat = +latlng = +lng
+    if (out_of_china(lng, lat)) {
+      return [lng, lat];
+    } else {
+      let dlat = transformlat(lng - 105.0, lat - 35.0);
+      let dlng = transformlng(lng - 105.0, lat - 35.0);
+      let radlat = (lat / 180.0) * PI;
+      let magic = Math.sin(radlat);
+      magic = 1 - ee * magic * magic;
+      let sqrtmagic = Math.sqrt(magic);
+      dlat = (dlat * 180.0) / (((a * (1 - ee)) / (magic * sqrtmagic)) * PI);
+      dlng = (dlng * 180.0) / ((a / sqrtmagic) * Math.cos(radlat) * PI);
+      let mglat = Math.round((lat * 2 - lat - dlat) * 1000000) / 1000000;
+      let mglng = Math.round((lng * 2 - lng - dlng) * 1000000) / 1000000;
+      return [mglng, mglat];
+    }
   }
 };
diff --git a/src/utils/map/index_old.js b/src/utils/map/index_old.js
index 69704ff..c296864 100644
--- a/src/utils/map/index_old.js
+++ b/src/utils/map/index_old.js
@@ -53,7 +53,7 @@
     viewMode: '3D', // 鍦板浘妯″紡
     resizeEnable: true,
     center: [121.6039283, 31.25295567],
-    zooms: [3, 18],
+    zooms: [0, 18],
     zoom: 14
   });
 
diff --git a/src/utils/map/marks.js b/src/utils/map/marks.js
index 0d3c21d..ed0c807 100644
--- a/src/utils/map/marks.js
+++ b/src/utils/map/marks.js
@@ -76,5 +76,66 @@
     });
     _massMarks = massMarks;
     map.add(massMarks);
+  },
+
+  createLabelMarks(img, dataList) {
+    // eslint-disable-next-line no-undef
+    const layer = new AMap.LabelsLayer({
+      zooms: [3, 20],
+      zIndex: 1000,
+      // 寮�鍚爣娉ㄩ伩璁╋紝榛樿涓哄紑鍚紝v1.4.15 鏂板灞炴��
+      collision: true,
+      // 寮�鍚爣娉ㄦ贰鍏ュ姩鐢伙紝榛樿涓哄紑鍚紝v1.4.15 鏂板灞炴��
+      animation: true
+    });
+
+    map.add(layer);
+
+    // var markers = [];
+    for (var i = 0; i < dataList.length; i++) {
+      const data = dataList[i];
+      var curData = {
+        name: data.name,
+        position: [data.longitude, data.latitude],
+        zooms: [10, 20],
+        opacity: 1,
+        zIndex: 10,
+        icon: {
+          type: 'image',
+          image: img,
+          // clipOrigin: [14, 92],
+          // clipSize: [50, 68],
+          size: [24, 24],
+          anchor: 'bottom-center',
+          angel: 0,
+          retina: true
+        },
+        text: {
+          content: data.name,
+          direction: 'top',
+          offset: [0, -5],
+          style: {
+            fontSize: 15,
+            fontWeight: 'normal',
+            fillColor: '#fff',
+            strokeColor: '#333',
+            strokeWidth: 2
+            // backgroundColor: '#b1009b'
+          }
+        }
+      };
+      curData.extData = {
+        index: i
+      };
+
+      // eslint-disable-next-line no-undef
+      var labelMarker = new AMap.LabelMarker(curData);
+
+      // markers.push(labelMarker);
+
+      layer.add(labelMarker);
+    }
+
+    return layer;
   }
 };
diff --git a/src/utils/map/util.js b/src/utils/map/util.js
index 3da926d..27871e9 100644
--- a/src/utils/map/util.js
+++ b/src/utils/map/util.js
@@ -13,5 +13,14 @@
       map.setCenter(lnglat);
       this.lasttime = now;
     }
+  },
+  addViews(view) {
+    map.add(view);
+  },
+  removeViews(view) {
+    map.remove(view);
+  },
+  setFitView() {
+    map.setFitView();
   }
 };
diff --git a/src/views/HomePage.vue b/src/views/HomePage.vue
index afe27b3..32d7a91 100644
--- a/src/views/HomePage.vue
+++ b/src/views/HomePage.vue
@@ -5,6 +5,8 @@
     <el-row class="dropdown-wrap">
       <MapToolbox></MapToolbox>
       <MissionManage></MissionManage>
+      <!-- <MapLocation></MapLocation> -->
+      <MapScene></MapScene>
     </el-row>
     <CoreMenu></CoreMenu>
     <router-view></router-view>
diff --git a/src/views/realtimemode/RealtimeMode.vue b/src/views/realtimemode/RealtimeMode.vue
index 1ecbd0a..c4de517 100644
--- a/src/views/realtimemode/RealtimeMode.vue
+++ b/src/views/realtimemode/RealtimeMode.vue
@@ -162,6 +162,7 @@
   unmounted() {
     this.clearFetchingTask();
     realTimeMapAnimation.stop();
+    console.log('clear');
   }
 };
 </script>

--
Gitblit v1.9.3