Procházet zdrojové kódy

更新 地图组件更换为高德地图lbs

wangzhihui před 4 roky
rodič
revize
d76d1a8cbf
2 změnil soubory, kde provedl 14 přidání a 31 odebrání
  1. 3 2
      index.html
  2. 11 29
      src/views/voyage/voyageDetail.vue

+ 3 - 2
index.html

@@ -4,10 +4,11 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/src/assets/logo.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <script
+    <!-- <script
       charset="utf-8"
       src="https://map.qq.com/api/gljs?v=1.exp&key=Y2BBZ-IHRKU-V42VO-BFQEE-K7252-ZBBSF"
-    ></script>
+    ></script> -->
+    <script src="https://webapi.amap.com/maps?v=2.0&key=0b84075e96d01623f704867a601139bb"></script>
     <title>Huihenduo App</title>
     <style>
       * {

+ 11 - 29
src/views/voyage/voyageDetail.vue

@@ -332,39 +332,21 @@ export default {
     }
 
     function initMap() {
-      var center = new TMap.LatLng(31.228721, 121.524761);
-      //初始化地图
-      map.value = new TMap.Map("map-container", {
-        zoom: 12, //设置地图缩放级别
-        center: center, //设置地图中心点坐标
+      map.value = new AMap.Map("map-container", {
+        zoom: 11, //级别
+        center: [121.524761, 31.228721], //中心点坐标
       });
     }
 
-    function setShipMarker(longitude, latitude) {
-      var marker = new TMap.MultiMarker({
-        id: "marker-layer", //图层id
-        map: map.value,
-        styles: {
-          //点标注的相关样式
-          marker: new TMap.MarkerStyle({
-            width: 25,
-            height: 35,
-            anchor: { x: 16, y: 32 },
-            src: "https://hhd-pat-1255802371.cos.ap-shanghai.myqcloud.com/frontend/ship-red-icon.png",
-          }),
-        },
-        geometries: [
-          {
-            //点标注数据数组
-            id: "demo",
-            styleId: "marker",
-            position: new TMap.LatLng(31.228721, 121.524761),
-            properties: {
-              title: "marker",
-            },
-          },
-        ],
+    function setShipMarker(longitude = 121.524761, latitude = 31.228721) {
+      var marker = new AMap.Marker({
+        position: new AMap.LngLat(longitude, latitude),
+        // offset: new AMap.Pixel(-10, -10),
+        size: new AMap.Size(80, 80),
+        icon: "https://hhd-pat-1255802371.cos.ap-shanghai.myqcloud.com/frontend/ship-red-icon.png", // 添加 Icon 图标 URL
+        title: "北京",
       });
+      map.value.add(marker);
     }
 
     let disabledStatus = ref(true);