1、在public的index.html中引入百度地图的api
<script type="text/javascript" src="//api.map.baidu.com/api?v=3.0&ak=秘钥"></script>
2、在组件中设置容器 案例中使用vue-charts
<v-charts :options="options"></v-charts>
3、初始化数据以及设置api
<script>
//导入echarts中bmap的依赖
import "echarts/extension/bmap/bmap"
export default {
data(){
return{
options:{
//关于百度地图的绘制
bmap:{
key:"ak秘钥",
//绘制的中心点
center:[116.404, 39.915],
//缩放比例 在 3到19之间 现在是图例的正中央
zoom:5,
//是否缩放
roam:false,
}
}
}
}
}
</script>
1.png
3设置地图的样式
[参考文档]（https://lbs.baidu.com/index.php?title=jspopularGL/guide/custom）
1、首先选择自己定制的样式
3.png
2、复制出样式
4.png
3、添加到bmap->mapStyle->styleJson中
5.png
4、效果图
8.png
