Vue前后端分离项目与vue-baidu-map百度地图api整合使用步骤

1、首先 

Vue前后端分离项目与vue-baidu-map百度地图api整合使用步骤_第1张图片

必须在index.html文件中引入  这段脚本,不然就算执行了下面的,地图也会不显示,这个是坑。

$ npm install vue-baidu-map --save

npm安装完后在vue页面

import BaiduMap from 'vue-baidu-map/components/Map/Map.vue' 


class  样式中自己设置高度和宽度。

然后在data中定义 center经纬度,zoom地图显示级别

Vue前后端分离项目与vue-baidu-map百度地图api整合使用步骤_第2张图片

method中定义handler初始化方法即可

Vue前后端分离项目与vue-baidu-map百度地图api整合使用步骤_第3张图片

你可能感兴趣的:(java)