no message

src/utils/dai-map.js

@@ -2,6 +2,85 @@ import nextTick from "dai-js/tools/nextTick";
 
 export const mapType = typeof window.TMap !== "undefined" ? "qq" : "td";
 
+export const QQMap = window.TMap;
+export const TDMap = window.T;
+
+export function searchNearby(map, keyword) {
+  if (mapType == "qq") {
+    return new Promise((reslove) => {
+      const search = new QQMap.service.Search(map, { pageSize: 10 });
+      search
+        .searchNearby({
+          keyword,
+          radius: 1000,
+          autoExtend: true,
+          center: map.getCenter(),
+        })
+        .then((result) => {
+          let { data } = result;
+          if (Array.isArray(data) && data.length > 0) {
+            const {
+              location: { lat, lng, address },
+            } = data[0];
+            reslove({
+              msg: "success",
+              data: {
+                lng,
+                lat,
+                address,
+                data,
+              },
+            });
+          } else {
+            reslove({
+              msg: "failed",
+              error: "未检索到相关位置坐标",
+            });
+          }
+        })
+        .catch((error) => {
+          reslove({
+            msg: "failed",
+            error,
+          });
+        });
+    });
+  } else {
+    return new Promise(async (reslove) => {
+      const search = new TDMap.LocalSearch(map, { pageCapacity: 10 });
+      search.setQueryType(1);
+      search.searchNearby(keyword, map.getCenter(), 1000000000);
+
+      await nextTick(1000);
+
+      const result = search.getResults();
+      const data = result ? result.getPois() : null;
+
+      console.log("检索结果", data);
+
+      if (Array.isArray(data) && data.length > 0) {
+        const { lonlat, address, name } = data[0];
+        const lng = lonlat.split(" ")[0];
+        const lat = lonlat.split(" ")[1];
+        reslove({
+          msg: "success",
+          data: {
+            lng,
+            lat,
+            address: address + name,
+            data,
+          },
+        });
+      } else {
+        reslove({
+          msg: "failed",
+          error: "未检索到相关位置坐标",
+        });
+      }
+    });
+  }
+}
+
 // 封装了地图相关函数，兼容天地图、腾讯地图常用api
 export default function init(ele, position, params) {
   this.mapType = mapType;
@@ -17,12 +96,8 @@ export default function init(ele, position, params) {
   this.setCenter = function (lat, lng) {};
   this.setMarker = function (lat, lng, title) {};
   this.getAddress = async function (lat, lng) {};
-  this.searchNearby = async function (keyword) {};
   this.on = function (eventType, fn) {};
 
-  const QQMap = window.TMap;
-  const TDMap = window.T;
-
   let { latitude, longitude } = position;
   if (!latitude || latitude == "" || latitude == "0") {
     latitude = 39.9088810666821;
@@ -88,46 +163,6 @@ export default function init(ele, position, params) {
       });
     };
 
-    this.search = new QQMap.service.Search(this.map, { pageSize: 10 });
-    this.searchNearby = async function (keyword) {
-      return new Promise((reslove) => {
-        this.search
-          .searchNearby({
-            keyword,
-            radius: 1000,
-            autoExtend: true,
-            center: this.map.getCenter(),
-          })
-          .then((result) => {
-            let { data } = result;
-            if (Array.isArray(data) && data.length > 0) {
-              const {
-                location: { lat, lng, address },
-              } = data[0];
-              reslove({
-                msg: "success",
-                data: {
-                  lng,
-                  lat,
-                  address,
-                },
-              });
-            } else {
-              reslove({
-                msg: "failed",
-                error: "未检索到相关位置坐标",
-              });
-            }
-          })
-          .catch((error) => {
-            reslove({
-              msg: "failed",
-              error,
-            });
-          });
-      });
-    };
-
     this.on = function (eventType, fn) {
       if (eventType == "dragend") {
         this.map.on("moveend", (e) => {
@@ -202,42 +237,6 @@ export default function init(ele, position, params) {
       });
     };
 
-    this.search = new TDMap.LocalSearch(this.map, { pageCapacity: 10 });
-    this.searchNearby = async function (keyword) {
-      return new Promise(async (reslove) => {
-        this.search.setQueryType(1);
-        this.search.searchNearby(keyword, this.map.getCenter(), 1000000000);
-
-        await nextTick(1000);
-
-        const result = this.search.getResults();
-        const data = result ? result.getPois() : null;
-
-        console.log("检索结果", data);
-
-        if (Array.isArray(data) && data.length > 0) {
-          const { lonlat, address, name } = data[0];
-          const lng = lonlat.split(" ")[0];
-          const lat = lonlat.split(" ")[1];
-          this.setCenter(lat, lng);
-          this.setMarker(lat, lng);
-          reslove({
-            msg: "success",
-            data: {
-              lng,
-              lat,
-              address: address + name,
-            },
-          });
-        } else {
-          reslove({
-            msg: "failed",
-            error: "未检索到相关位置坐标",
-          });
-        }
-      });
-    };
-
     this.on = function (eventType, fn) {
       if (eventType == "dragend") {
         this.map.on("dragend", (e) => {
@@ -250,5 +249,11 @@ export default function init(ele, position, params) {
     };
   }
 
+  this.searchNearby = async function (keyword) {
+    const ret = await searchNearby(this.map, keyword);
+
+    return ret;
+  };
+
   return this;
 }

src/views/modules/visual/command/cpts/map.vue

@@ -31,9 +31,11 @@ import {
   PointLayer,
   Marker,
   Popup,
+  RasterLayer,
 } from "@antv/l7";
 import { GaodeMap, Map } from "@antv/l7-maps";
 import { spliceIntoChunks } from "@/utils/index";
+import { mapType, searchNearby } from "@/utils/dai-map";
 
 let myMap;
 let scene;
@@ -327,23 +329,32 @@ export default {
         styleConfig = lightStyle;
       }
 
-      myMap = new GaodeMap({
+      const iniCenter = [
-        pitch: this.pitch,
+        srcGridData.longitude ||
-        style: styleConfig.style,
+          this.$store.state.user.longitude ||
-        center: [
+          116.39743841556731,
-          srcGridData.longitude ||
+        srcGridData.latitude ||
-            this.$store.state.user.longitude ||
+          this.$store.state.user.latitude ||
-            116.39743841556731,
+          39.9088810666821,
-          srcGridData.latitude ||
+      ];
-            this.$store.state.user.latitude ||
+
-            39.9088810666821,
+      if (mapType == "td") {
-        ],
+        myMap = new Map({
-        token: "fc14b42e0ca18387866d68ebd4f150c1",
+          center: iniCenter,
-        zoom: 18,
+          zoom: 18,
-        isHotspot: false,
+        });
-        resizeEnable: true,
+      } else {
-        doubleClickZoom: false,
+        myMap = new GaodeMap({
-      });
+          pitch: this.pitch,
+          style: styleConfig.style,
+          center: iniCenter,
+          token: "fc14b42e0ca18387866d68ebd4f150c1",
+          zoom: 18,
+          isHotspot: false,
+          resizeEnable: true,
+          doubleClickZoom: false,
+        });
+      }
 
       scene = new Scene({
         id: "map",
@@ -352,6 +363,10 @@ export default {
       });
 
       scene.on("loaded", async () => {
+        if (mapType == "td") {
+          this.iniMapBase(scene);
+        }
+
         this.iniMapGrid(scene);
         this.iniMapDot(scene);
         this.iniMapDot2(scene);
@@ -360,6 +375,46 @@ export default {
       });
     },
 
+    // 初始化底图
+    iniMapBase(scene) {
+      // 底图服务
+      const baseLayer = new RasterLayer({
+        zIndex: 1,
+      });
+      baseLayer.source(
+        "http://t4.tianditu.com/DataServer?T=vec_w&tk=8a08c117ab9ee45d508686b01cc8d397&x={x}&y={y}&l={z}",
+        {
+          parser: {
+            type: "rasterTile",
+            tileSize: 256,
+            // minZoom: 6,
+            // maxZoom: 15,
+            zoomOffset: 0,
+          },
+        }
+      );
+
+      // 注记服务
+      const annotionLayer = new RasterLayer({
+        zIndex: 2,
+      });
+      annotionLayer.source(
+        "https://t4.tianditu.com/DataServer?T=cva_w&X={x}&Y={y}&L={z}&tk=8a08c117ab9ee45d508686b01cc8d397",
+        {
+          parser: {
+            type: "rasterTile",
+            tileSize: 256,
+            // minZoom: 6,
+            // maxZoom: 15,
+            zoomOffset: 0,
+          },
+        }
+      );
+
+      scene.addLayer(baseLayer);
+      scene.addLayer(annotionLayer);
+    },
+
     iniMapGrid(scene) {
       const { darkStyle, lightStyle, polygonData, polygonDotData } = this;
 
@@ -806,20 +861,25 @@ export default {
     },
 
     searchPos(name) {
-      return new Promise((reslove) => {
+      console.log("=----------------------=searchPos", name);
-        window.AMap.plugin("AMap.PlaceSearch", () => {
+      return new Promise(async (reslove) => {
-          const city = this.$store.state.user.areaCodePath[1] || "全国";
+        if (mapType == "td") {
-          console.log("搜索区域", city);
+          reslove([]);
-          // 实例化Autocomplete
+        } else {
-          let autoOptions = {
+          window.AMap.plugin("AMap.PlaceSearch", () => {
-            //city 限定城市，默认全国
+            const city = this.$store.state.user.areaCodePath[1] || "全国";
-            city,
+            console.log("搜索区域", city);
-          };
+            // 实例化Autocomplete
-          let autoComplete = new window.AMap.PlaceSearch(autoOptions);
+            let autoOptions = {
-          autoComplete.search(name, function (status, result) {
+              //city 限定城市，默认全国
-            reslove(result);
+              city,
+            };
+            let autoComplete = new window.AMap.PlaceSearch(autoOptions);
+            autoComplete.search(name, function (status, result) {
+              reslove(result);
+            });
           });
-        });
+        }
       });
     },
   },