vue3leaflet加载带经纬度天地图影像图和注记

要在 Vue3Leaflet 中加载带有经纬度的天地图影像图和注记，您需要执行以下步骤：

1. 安装 `vue3-leaflet` 和 `leaflet` 包，可以使用 npm 进行安装：

npm install vue3-leaflet leaflet --save

2. 在 `main.js` 中引入所需的包并注册：

import { createApp } from 'vue'
import App from './App.vue'
import { LMap, LTileLayer } from 'vue3-leaflet'
import 'leaflet/dist/leaflet.css'

createApp(App).component('l-map', LMap).component('l-tile-layer', LTileLayer).mount('#app')

3. 在 `App.vue` 中添加地图和图层：

<template>
  <l-map :zoom="zoom" :center="center">
    <l-tile-layer :url="url" :attribution="attribution"></l-tile-layer>
    <l-tile-layer :url="urlAnno" :attribution="attribution"></l-tile-layer>
  </l-map>
</template>

<script>
export default {
  name: 'App',
  data () {
    return {
      zoom: 13,
      center: [39.9, 116.4],
      url: 'http://{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=your_token',
      urlAnno: 'http://{s}.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=your_token',
      attribution: '天地图'
    }
  }
}
</script>

其中，`url` 和 `urlAnno` 中的 `tk=your_token` 部分需要替换为您申请的天地图开发者 token。

4. 运行项目，即可在 Vue3Leaflet 中加载带有经纬度的天地图影像图和注记。