一、申请AK
在百度地图开放平台申请AK,申请成功如下图所示:
二、实用步骤
1.安装vue-baidu-map-3x:
npm install vue-baidu-map-3x --save
2.在main.js中进行全局配置
注意事项:
1.BaiduMap 组件容器本身是一个空的块级元素,如果容器不定义高度,百度地图将渲染在一个高度为 0 不可见的容器内;
2.没有设置 center 和 zoom 属性的地图组件是不进行地图渲染的。当center 属性为合法地名字符串时例外,因为百度地图会根据地名自动调整 zoom 的值;
3.由于百度地图 JS API 只有 JSONP 一种加载方式,因此 BaiduMap 组件及其所有子组件的渲染只能是异步的。
3.在页面中使用
效果展示:
Tips:具体控件实用规则可参考该链接Vue Baidu Map