在vue-baidu-map中使用个性化地图

vue-baidu-map使用个性化地图

1. 、项目使用vue-baidu-map进行开发
2. 使用baidu-map标签渲染地图并且mapStyle自定义样式，发现地图的底图已-经落后了
3. 如果去掉mapStyle的属性, 底图又跟官网一样
4. 最后查了一下baidu-map组件，发现封装的setMapStyle的方法是旧方法setMapStyle
5. 现在新地图底图都是使用setMapStyleV2方法. 而且组件里面引用的js也是2.0的版本

解决方法

1. 在index.html页面引入百度地图3.0js

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

2. 在组件baidu-map的@ready="mapReady"回调方法里面调用setMapStyleV2方法

   mapReady({BMap,map}) {
      map.setMapStyleV2({
          styleId: '58c6f14ab969abdd43ee04b747fe8325'
        })
    },

https://dandelioncloud.cn/article/details/2021011923235423181