投稿
  1. 簡單一點首頁
  2. 編程

Vue高德地圖多個地點標註詳解

PKHTI • • 編程

一、地圖組件的引入

首先需要在項目中引入高德地圖組件，在Vue中可以使用高德地圖JavaScript API實現。在main.js中引入以下代碼：

  
    import VueAMap from 'vue-amap';
    Vue.use(VueAMap);
    //初始化 VueAMap
    VueAMap.initAMapApiLoader({
        key: '高德地圖的key', // 使用自己申請的高德地圖的key
        plugin: ['AMap.Geolocation', 'AMap.MarkerClusterer'], // 根據需要引入所需插件
        v: '1.4.4'
    });

二、引入地圖組件

在Vue頁面中，我們需要引入VueAMap組件。我們使用高德地圖的Map組件來展示地圖。而經緯度則在VueAMap內的Marker組件。

原創文章，作者：PKHTI，如若轉載，請註明出處：https://www.506064.com/zh-hant/n/334271.html
贊 (0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
PKHTI的頭像PKHTI
0 0
上一篇 2025-02-05 13:05
下一篇 2025-02-05 13:05

相關推薦

發表回復

登錄後才能評論