使用

1. 在天地图官网申请应用key，应用类型选择【浏览器端】，将key赋值给mapKey

2. 导入组件 uni_models组件，下载后直接在页面vue文件中使用。

3. 定义ref，组件的方法均通过ref调用。

4. 全局地图方法均可使用then/catch、async/await、或者参数{success，fail}回调函数获取执行结果，详见示例代码。

5. 组件方法均为同步操作！！！

示例代码

注意mosowe-tdt-x与mosowe-tdt的写法区别！后续文档不一一列举

mosowe-tdt组件

<template>
  <!-- 天地图组件 -->
  <mosowe-tdt
    ref="TDTRenderRef"
    mapKey="************************"
    @onLoad="TDTLoad"
  ></mosowe-tdt>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  const TDTRenderRef = ref<any>();
  const TDTLoad = async data => {
    // 添加中心点marker
    TDTRenderRef.value.addMarkers({
      list: [
        {
          lnglat: [data.lng, data.lat]
        }
      ],
      success(res) {},
      fail(err) {}
    });
    // 或
    // TDTRenderRef.value.addMarkers({
    //   list: [
    //     {
    //       lnglat: [data.lng, data.lat]
    //     }
    //   ]
    // })
    //   .then(res=>{})
    //   .catch(err=>{})

    // 或
    // const res = await TDTRenderRef.value.addMarkers({
    //   list: [
    //     {
    //       lnglat: [data.lng, data.lat]
    //     }
    //   ]
    // })
  };
</script>

mosowe-tdt-x组件

<template>
  <!-- 天地图组件 -->
  <mosowe-tdt-x
    ref="TDTRenderRef"
    mapKey="************************"
    @onLoad="TDTLoad"
  ></mosowe-tdt-x>
</template>

<script setup lang="uts">
const TDTRenderRef = ref<MosoweTdtXComponentPublicInstance | null>(null)
  const TDTLoad = async data => {
    // 添加中心点marker
    TDTRenderRef.value?.addMarkers?.({
      list: [
        {
          lnglat: [data.lng, data.lat]
        }
      ],
      success(res) {},
      fail(err) {}
    });
  };
</script>

贡献者

mosowe