vue离线加载百度地图，无法缩放滚动以及加载覆盖物

参考这个链接配置
https://blog.csdn.net/Zwain_M/article/details/115548665?spm=1001.2101.3001.6650.2&utm_medium=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~default-2.no_search_link&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~default-2.no_search_link
?%ra=link

<template>
  <div class="index_home">
    <!--  content  -->
    <div class="data_content">
      <!--            地图-->
      <baidu-map   :center="center" :zoom="zoom" :scroll-wheel-zoom="true" style="height:100vh" @ready="handler" class="baiduMap" >
        <!--        <map-overlay :position="{lng: 116.815891,lat: 33.732117}" text="福田口岸" ></map-overlay>-->
      </baidu-map>
    </div>
  </div>
</template>

<script>
import Vue from 'vue';
import BaiduMap from 'vue-baidu-map'
Vue.use(BaiduMap, {
  ak: 'q8Cxni1X9pYG5nkPhXTyFNIa6uOcrufG' //官方提供的ak秘钥
})
export default {
  data (){
    return {
      center: { lng: 116.955595, lat: 33.683585 }, //经纬度
      zoom: 13 ,//地图展示级别,
      mapType:"BMAP_NORMAL_MAP",
      mapStyle: {
        styleJson: [
          {"featureType": "land", "elementType": "all", "stylers": {"color": "#111424ff"}},
          {"featureType": "road", "elementType": "all", "stylers": {"color": "#293142ff"}},
          {"featureType": "water", "elementType": "all", "stylers": {"color": "#1b2638ff"}},
          {"featureType": "green", "elementType": "all", "stylers": {"color": "#111424ff"}},
          {"featureType": "manmade", "elementType": "all", "stylers": {"color": "#111424ff"}},
          {"featureType": "building", "elementType": "all", "stylers": {"color": "#f1c232ff"}},
          {"featureType": "all", "elementType": "labels", "stylers": {"visibility": "off"}}
        ]
      }
    }
  },
  methods: {
    handler({ BMap, map }) {
      var point1 = new BMap.Point( 116.815891, 33.732117)
      var marker1 = new BMap.Marker(point1)
      map.addOverlay(marker1)
      console.log(point1)
      console.log(BMap)
      console.log(map)
    }
  },

}
</script>

<style scoped>



</style>

以上是我的vue页面，目前遇到问题是地图加载成功，但是无法缩放和拖拽，同时添加覆盖物也没法显示，麻烦跟我我的代码给修改建议，最好能贴代码

https://www.cnblogs.com/spaortMan/p/13932126.html