vue集成百度地图vue-baidu-map
要在Vue项目中集成百度地图,首先需要安装vue-baidu-map
组件库。
- 安装
vue-baidu-map
:
npm install vue-baidu-map --save
- 在Vue项目中全局引入
vue-baidu-map
:
// main.js 或者其他的入口文件
import Vue from 'vue'
import BaiduMap from 'vue-baidu-map'
Vue.use(BaiduMap, {
ak: '你的百度地图ak' // 这里填写你的百度地图ak
})
new Vue({
// ...
}).$mount('#app')
- 在组件中使用
vue-baidu-map
:
<template>
<baidu-map class="map" :center="{lng: 116.404, lat: 39.915}" :zoom="15">
<!-- 你可以在这里添加更多的地图组件和功能 -->
</baidu-map>
</template>
<script>
export default {
// ...
}
</script>
<style>
.map {
width: 100%;
height: 300px;
}
</style>
这样就可以在Vue项目中使用百度地图了。你可以根据需要添加更多的地图组件和功能,比如标记点、缩放控件、地图事件等。
评论已关闭