一、在 http://lbsyun.baidu.com/ 申請 祕鑰

二、在index.html檔案中引入      

<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=Fh9X4hT3ygcBMZnlPbRlMG508r0OCqsk"></script>

三、在需要引入的頁面

<div id="allmap" style="height:100%"></div>

 methods: {
    ready: function(x, y) {
        var map = new BMap.Map('allmap')//顯示標籤
        var point = new BMap.Point(x, y)
        
        map.addControl(new BMap.MapTypeControl())
        map.enableScrollWheelZoom(true)//啟用滾輪放大縮小，預設禁用
        map.enableContinuousZoom(); //啟用地圖慣性拖拽，預設禁用
        map.enableDoubleClickZoom(true)
        var marker = new BMap.Marker(point)
      
        
        map.addOverlay(marker)

        map.centerAndZoom(point, 15)// 初始化地圖,設定城市和地圖級別。
        map.centerAndZoom(point, 14)// 初始化地圖,設定城市和地圖級別。
    },
 },
  mounted(){
      //this.ready(x,y)
      this.ready(120,30)
         
  }
 

 效果圖