vue2調用高德地圖(Amap)及其UI組件

vue調用高德地圖只需四步,具體如下:

1、申請高德KEY。方法自行百度 http://lbs.amap.com/dev/key/app
2、在項目的index.js文件中引入高德地圖JS_API,如下:
這裏寫圖片描述

3、在項目build/webpack.base.conf.js中加入如下代碼:

externals: {
   'AMap': 'AMap',
   'AMapUI': 'AMapUI'
 }
  • 具體位置如下:
    這裏寫圖片描述

4、在你需要使用地圖的組件中初始化並渲染,具體如下:
這裏寫圖片描述


注:

  • 記得重啓項目(如遇報錯);
  • 畫紅線注意點之外,其餘屬性,自行查看高德API即可;

end~

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章