用帝国cms做门户网站,北京王府井简介,网站开发前景,wordpress中文菜单文章目录 vue集成百度地图vue-baidu-map1. Vue Baidu Map文档地址2. 设置npm数据源3. 安装vue-baidu-map4. 配置vue-baidu-map4.1 main.js全局注册4.2 vue页面设置4.3 效果 vue集成百度地图vue-baidu-map
1. Vue Baidu Map文档地址
https://dafrok.github.io/vue-baidu-map/#… 文章目录 vue集成百度地图vue-baidu-map1. Vue Baidu Map文档地址2. 设置npm数据源3. 安装vue-baidu-map4. 配置vue-baidu-map4.1 main.js全局注册4.2 vue页面设置4.3 效果 vue集成百度地图vue-baidu-map
1. Vue Baidu Map文档地址
https://dafrok.github.io/vue-baidu-map/#/zh/index2. 设置npm数据源
npm config set registryhttps://registry.npmmirror.com查看npm数据源
npm config get registry3. 安装vue-baidu-map
npm install vue-baidu-map --save4. 配置vue-baidu-map
4.1 main.js全局注册
import BaiduMap from vue-baidu-mapVue.use(BaiduMap, {ak:
})4.2 vue页面设置
index.vue
template
baidu-map classbm-view :centercenter :zoomzoom :scroll-wheel-zoomtruebm-scale anchorBMAP_ANCHOR_TOP_RIGHT/bm-scalebm-navigation anchorBMAP_ANCHOR_TOP_RIGHT/bm-navigationbm-geolocation anchorBMAP_ANCHOR_BOTTOM_RIGHT :showAddressBartrue :autoLocationtrue/bm-geolocation/baidu-map
/templatescriptexport default {name: Index,components: {},data() {return {lineChartData: lineChartData.newVisitis,center: {lng: 108.889191, lat:34.274342},zoom: 15}},}/script
style.bm-view {width: 100%;height: 500px;}/style4.3 效果
