<bm-map-type
:map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"
:offset="{ width: 360, height: 165 }"
></bm-map-type>
<!-- 缩放控件 anchor代表控件停靠位置 anchor="BMAP_ANCHOR_TOP_RIGHT"代表放在右上角-->
<bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
<!-- 插入全景控件 -->
<bm-panorama :offset="{ width: 300, height: 150 }"></bm-panorama>
这种写法会导致地图类型图标一直加载导致页面非常卡顿
解决办法
注释掉上面代码,修改成下面代码
handler({ BMap, map }) {
//添加地图类型控件
map.addControl(
new BMap.MapTypeControl({
mapTypes: [BMAP_NORMAL_MAP, BMAP_HYBRID_MAP],
offset: new BMap.Size(360, 165),
})
)
//设置中心点坐标
var pointCenter = new BMap.Point(116.133715, 40.128512)
//构造全景控件
var stCtrl = new BMap.PanoramaControl()
//地图初始化,同时设置地图展示级别
map.centerAndZoom(pointCenter, 6)
map.setMinZoom(3)
//开启鼠标滚轮缩放
map.enableScrollWheelZoom(true)
//设置全景地图摄像头偏移位置
stCtrl.setOffset(new BMap.Size(300, 150))
//添加全景控件
map.addControl(stCtrl)
//mapB.setMapStyle(mapStyle);
map.enableScrollWheelZoom(true)
},