十六 百度地图 + Vue

← 百度地图可视化

基本用法

  1. 引入 js 库

  1. 挂载 Vue 实例
Vue.prototype.$bmap = window.BMapGL
  1. 编写代码





注意以下问题:

  • 容器 div 需要使用 id
  • 容器 div 需要指定宽高

其余用法与 html 中编码无异

百度地图组件封装

封装 BaiduMap 组件 :




优化上节中的源码:




飞线地图移植

添加依赖






在 main.js 中添加百度地图相关对象

Vue.prototype.$bmap = window.BMapGL
Vue.prototype.$initMap = window.initMap
Vue.prototype.$mapvgl = window.mapvgl
Vue.prototype.$mapv = window.mapv
Vue.prototype.$purpleStyle = window.purpleStyle

代码移植和修改






炫酷飞线地图移植






ECharts地图→

你可能感兴趣的:(十六 百度地图 + Vue)