map

public/index.html

@@ -25,10 +25,10 @@
     </script>
     <script type="text/javascript">
       window._AMapSecurityConfig = {
-        securityJsCode: 'bf7d8bf1e71d89263dcbf4829882791d',
+        securityJsCode: '87e84280042f6e9b4f07bfa4b67288e8',
       }  </script>
     <script type="text/javascript"
-      src="https://webapi.amap.com/maps?v=2.0&key=e8d3513c8551b20ec90b991249fa59a1"></script>
+      src="https://webapi.amap.com/maps?v=2.0&key=389e81c4c61fd6dff4ab8f742af82e5f"></script>
 
   </head>
 

src/controllers/wxController.ts

@@ -168,14 +168,6 @@ export class wxController {
       infoUrl: "", // 在查看位置界面底部显示的超链接,可点击跳转
       ...options,
     };
-    wx.openLocation({
-      ...options,
-      success: function () {
-        console.error("设置成功");
-      },
-      fail: function (msg: any) {
-        console.error("设置失败：" + JSON.stringify(msg));
-      },
-    });
+    wx.openLocation(options);
   }
 }

src/modules/editor/components/CompUI/basicUI/Map/component.tsx

@@ -4,6 +4,7 @@ import { defineComponent, onMounted, ref, watch } from "vue";
 import { string } from "vue-types";
 import { useCompData } from ".";
 import { View } from "../View";
+// import AMapLoader from "@amap/amap-jsapi-loader";
 
 declare const AMap: any;
 
@@ -17,12 +18,23 @@ export const Component = defineComponent({
     const comp = useCompData(props.compId);
     const { value } = comp;
 
+    // const AMap = ref();
     const map = ref();
     const marker = ref();
 
     function initMap() {
+      // AMapLoader.load({
+      //   key: "389e81c4c61fd6dff4ab8f742af82e5f", // 申请好的Web端开发者Key，首次调用 load 时必填
+      //   version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+      //   plugins: ["AMap.Scale", "AMap.ToolBar", "AMap.MouseTool"], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+      //   Loca: {
+      //     version: "2.0.0",
+      //   },
+      // })
+      //   .then((res) => {
+      // AMap.value = res;
       map.value = new AMap.Map(props.compId, {
-        viewMode: "3D",
+        // viewMode: "3D",
         zoom: 11,
         center: value.addressInfo.lnglat,
       });
@@ -37,6 +49,10 @@ export const Component = defineComponent({
           map.value.addControl(toolbar);
         }
       });
+      // })
+      // .catch((e: any) => {
+      //   console.log("error", e);
+      // });
     }
 
     function updateMap() {
@@ -72,8 +88,11 @@ export const Component = defineComponent({
       <View compId={props.compId}>
         <div
           id={props.compId}
-          class="w-95/100 mx-auto"
-          style={{ aspectRatio: 1 }}
+          class="w-1/1"
+          // style={{ aspectRatio: 1 }}
+          style={{
+            height: "calc(100% - 44px)",
+          }}
         ></div>
         {!store.isEditMode && (
           <div
@@ -84,7 +103,7 @@ export const Component = defineComponent({
           </div>
         )}
 
-        <div class="text-14px text-[#666] py-15px text-center">
+        <div class="text-14px text-[#666] py-15px text-center bg-light-50">
           {value.addressInfo.address}
         </div>
       </View>

src/modules/editor/components/CompUI/basicUI/Map/index.ts

@@ -17,7 +17,7 @@ export const { createComp, useCompData } = createCompHooks({
     },
   },
   layout: {
-    size: [750, 800],
+    size: [710, 710],
   },
 });
 

src/modules/editor/components/CompUI/defines/createAttrsForm.tsx

@@ -201,7 +201,7 @@ export function createAttrsForm(valueColumns: ColumnItem[]) {
               columns={layoutColumns}
               onChange={changeVal}
             />
-            {["Web3D", "Video"].includes(component.compKey) ? null : (
+            {["Web3D", "Video", "Map"].includes(component.compKey) ? null : (
               <>
                 <div>背景</div>
                 <FormUI

src/modules/editor/components/CompUI/formItems/MapAttr.tsx

@@ -10,7 +10,7 @@ export default defineComponent({
   },
   emits: ["change"],
   setup(props, { emit }) {
-    // const AMap = ref(AMap);
+    // const AMap = ref();
     const map = ref();
     const marker = ref();
     const geocoder = ref();
@@ -31,7 +31,7 @@ export default defineComponent({
     }
 
     function updateLnglat() {
-      marker.value.setPosition(state.lnglat);
+      marker.value?.setPosition(state.lnglat);
       map.value.add(marker.value);
       map.value.setZoomAndCenter(11, state.lnglat);
       emit("change", { address: state.address, lnglat: state.lnglat });
@@ -70,7 +70,7 @@ export default defineComponent({
       autoComplete.value.search(
         state.address,
         function (status: any, result: any) {
-          if (status === "complete" && result.regeocode) {
+          if (status === "complete") {
             // 搜索成功时，result即是对应的匹配数据
             state.tips = result.tips || [];
             state.visible = true;
@@ -83,13 +83,8 @@ export default defineComponent({
     };
 
     const initMap = () => {
-      map.value = new AMap.Map("mapJsContainer", {
-        viewMode: "3D", //是否为3D地图模式
-        zoom: 11, //初始化地图级别
-        center: state.lnglat, //初始化地图中心点位置
-      });
       // AMapLoader.load({
-      //   key: "e8d3513c8551b20ec90b991249fa59a1", // 申请好的Web端开发者Key，首次调用 load 时必填
+      //   key: "389e81c4c61fd6dff4ab8f742af82e5f", // 申请好的Web端开发者Key，首次调用 load 时必填
       //   version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
       //   plugins: ["AMap.Scale", "AMap.ToolBar", "AMap.MouseTool"], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
       //   Loca: {
@@ -97,13 +92,21 @@ export default defineComponent({
       //   },
       // })
       //   .then((res) => {
+      //     AMap.value = res;
+      map.value = new AMap.Map("mapJsContainer", {
+        // viewMode: "3D", //是否为3D地图模式
+        zoom: 11, //初始化地图级别
+        center: state.lnglat, //初始化地图中心点位置
+      });
 
       AMap.plugin(
         ["AMap.Geocoder", "AMap.AutoComplete", "AMap.ToolBar"],
         () => {
           // 使用geocoder做地理/逆地理编码
           geocoder.value = new AMap.Geocoder();
-          autoComplete.value = new AMap.AutoComplete({ city: "全国" });
+          autoComplete.value = new AMap.AutoComplete({
+            city: "全国",
+          });
 
           const toolbar = new AMap.ToolBar({ position: "LT" }); // 缩放工具条实例化
           map.value.addControl(toolbar);
@@ -136,6 +139,9 @@ export default defineComponent({
     watch(
       () => [props.value],
       () => {
+        const { lnglat } = props.value;
+        if (state.lnglat[0] == lnglat[0] && state.lnglat[1] == lnglat[1])
+          return;
         state.address = props.value.address;
         state.lnglat = props.value.lnglat;
         updateLnglat();
@@ -149,10 +155,10 @@ export default defineComponent({
             value={state.address}
             placeholder="请输入地名"
             class="w-1/1"
-            onSearch={searchAddress}
+            // onSearch={searchAddress}
             onChange={(e) => {
               state.address = e.target.value || "";
-              // searchAddress();
+              searchAddress();
             }}
           />
           {state.visible && (