- 综合排序
- 最热优先
- 最新优先
- 来自专栏404
使用 vue-baidu-map
使用 vue-baidu-map 写在前面 vue-baidu-map 是百度开源的一个基于vue的小众插件，底层使用的是百度 jsapi 1.0 ，版本官网目前最新版是3.0。 开发手册：https://dafrok.github.io/vue-baidu-map/#/zh/index JS类参考：http://lbsyun.baidu.com/cms/jsapi/reference title=jspopular3.0 下载依赖 yarn add vue-baidu-map 全局注册 import Vue from 'vue' import BaiduMap from 'vue-baidu-map lang="scss" scoped> .bm-view { width: 100%; height: calc(100vh); } </style> 运行效果 如图 image.png 总结 vue-baidu-map
1.6K10编辑于 2022-04-25 - 来自专栏404
解决 vue-baidu-map 无法绘制折线方向箭头
根据vue-baidu-map折线组件的官方文档，在vue中通过Prop，为BmPolyline组件传递一个icons数组，数组的元素必须为IconSequence类的实例对象。 但在开发过程中发现vue-baidu-map封装的BmPolyline折线组件不能顺利绘制出带箭头的纹理。 解决方案 将/node_modules/vue-baidu-map/components/overlays目录下的BmPolyline源文件复制，粘贴到另一个vue文件中，然后手动为折线组件配置icons
95720编辑于 2022-04-25 - 来自专栏程序小小事
这可能是 Vue 接入百度地图的最佳组件了
图片图片使用这里展示在Vue项目中的使用安装NPM加载依赖$ npm install vue-baidu-map --save注册全局注册：一次性引入百度地图组件库的所有组件。 import Vue from 'vue'import BaiduMap from 'vue-baidu-map'Vue.use(BaiduMap, { // ak 是在百度地图开发者平台申请的密钥 from 'vue-baidu-map/components/search/LocalSearch'; //搜索import BmMarker from 'vue-baidu-map/components /overlays/Marker'; //点标注import BmInfoWindow from 'vue-baidu-map/components/overlays/InfoWindow'; //标注弹窗 顺便一提一下...VUE BAIDU MAP地址https://dafrok.github.io/vue-baidu-map/#/祝大家搬砖愉快！
58200编辑于 2023-07-20 - 来自专栏软件
Vue使用百度地图
GitHub：https://github.com/Dafrok/vue-baidu-map/blob/master/README.zh.md 在线文档：https://dafrok.github.io /vue-baidu-map 安装依赖 $ npm install vue-baidu-map 初始化百度地图 <baidu-map class="map" style="width: 100% /components/map/Map.vue' import Navigation from '<em>vue-baidu-map</em>/components/controls/Scale' export default /components/map/Map.vue' import {BmNavigation} from '<em>vue-baidu-map</em>' export default { components: { BaiduMap, BmNavigation }, } </script 在<em>vue-baidu-map</em>中地图缩放控件就是叫BmNavigation但是却不生效，知道原因的可以给我科普一下
83120编辑于 2023-02-21 - 来自专栏前端实验室
这可能是 Vue 接入百度地图的最佳组件了！
安装 NPM加载依赖 $ npm install vue-baidu-map --save 注册 全局注册：一次性引入百度地图组件库的所有组件。 import Vue from 'vue' import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap, { // ak 是在百度地图开发者平台申请的密钥 from 'vue-baidu-map/components/search/LocalSearch'; //搜索 import BmMarker from 'vue-baidu-map/components /overlays/Marker'; //点标注 import BmInfoWindow from 'vue-baidu-map/components/overlays/InfoWindow'; //标注弹窗 VUE BAIDU MAP地址 https://dafrok.github.io/vue-baidu-map/#/ 祝大家搬砖愉快！
87830编辑于 2022-12-02 - 来自专栏web秀
Vue.js下引入百度地图jsApi的两种方法
VUE:[https://github.com/Dafrok/vue-baidu-map] React:[https://github.com/huiyan-fe/react-bmap] 可参考它们在 （1）安装 npm i vue-baidu-map --save （2）初始化 import Vue from 'vue' import BaiduMap from 'vue-baidu-map' Vue.use
5.5K10发布于 2019-12-10 - 来自专栏国标视频云平台
免费视频直播、点播H5播放器SkeyeWebPlayer 结合百度地图sdk实现电子地图播放功能
免费视频直播、点播H5播放器SkeyeWebPlayer 结合vue-baidu-map百度地图组件实现电子地图播放功能，最终效果如图所示：图片SkeyeWebPlayer播放器如何在vue-baidu-map -- built files will be auto injected --> </body></html>3、在项目中按装 vue-baidu-mapnpm install vue-baidu-map --save局部引入 vue-baidu-mapimport {BaiduMap, BmView, BmLocalSearch, BmMarker, BmInfoWindow} from "vue-baidu-map
3.8K30编辑于 2023-04-04 - 来自专栏javascript趣味编程
如何在vue单页应用中使用百度地图
所有的独立组件均存放在 vue-baidu-map/components 文件夹下，按需引用即可。 //百度地图 import BaiduMap from 'vue-baidu-map/components/map/Map.vue' import BmScale from 'vue-baidu-map from 'vue-baidu-map/components/overlays/Marker' import BmInfoWindow from 'vue-baidu-map/components ' import BmScale from 'vue-baidu-map/components/controls/Scale' import BmNavigation from 'vue-baidu-map ' import BmMarker from 'vue-baidu-map/components/overlays/Marker' import BmInfoWindow from 'vue-baidu-map
2K20发布于 2021-08-13 - 来自专栏前端文章小tips
vue中引入百度地图API
script> 第二种 通过模块化引入的方法 百度地图官方已经有api的vue版本 地址：https://github.com/Dafrok/vue-baidu- map 安装 npm i --save vue-baidu-map 初始化 import Vue from 'vue' import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap, { ak: 'YOUR_APP_KEY
70120编辑于 2021-11-30 - 来自专栏辰远
Vue项目引入百度地图
使用 百度地图Vue：Vue Baidu Map 执行 npm install vue-baidu-map 然后再main.js里加上（注意你自己的ak密钥） import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap, { ak: 'GpRqD2Sowifs********RRRRVl9' }); 然后就可以在组件里使用了，最简单的一个例子
86330编辑于 2022-11-15 - 来自专栏王念博客
简单了解 node npm cnpm
--save ：记录在 package.json的“dependencies（运行时所需要的包）”，eg npm i --save vue-baidu-map // i 是 install 的缩写,就像 （2）npm更新安装包 更新本地安装包： npm update eg，更新本地安装的 vue-baidu-map 包： ? （3）卸载npm安装包 卸载本地安装包 npm uninstall <package> eg，卸载本地安装的 vue-baidu-map 包： ?
1.7K20发布于 2019-07-25 - 来自专栏Dawnzhang的开发者手册
vue项目中遇到的那些事。
技术栈：vue2 + vuex + vue-router + webpack + ES6/7 + element-ui + vue-baidu-map + i18n + vue-awesome-swiper 推荐一个地图插件：vue-baidu-map(百度地图)vue-google-maps（谷歌地图） 文档：https://dafrok.github.io/vue-baidu-map/ 安装 npm i --save vue-baidu-map 在main.js中引入 // 引入百度地图插件 import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap
1.5K20发布于 2019-03-04 - 来自专栏夏天的前端笔记
地图功能的实现
效果实现： 源代码： 百度地图组件： https://dafrok.github.io/vue-baidu-map/#/zh/start/usage <!
35210编辑于 2024-01-18 - 来自专栏夏天的前端笔记
组件需要覆盖下面的按钮样式
this.showFooterButtons = true; this.mapKeyword = ""; }, } 地图弹出框 1.Vue Baidu Map地图组件 https://dafrok.github.io/vue-baidu-map
45810编辑于 2024-01-18 垃圾分类管理系统源码+SpringBoot + Vue (前后端分离)
Promise based HTTP库，用于发送异步HTTP请求- Vue-Axios 2.1.5 - Axios的Vue.js插件版本- qs 6.9.1 - 查询字符串解析和序列化库地图功能- vue-baidu-map
38710编辑于 2025-06-16- 来自专栏知码前端
实力大比拼，基于vue的地图组件库
文档地址为： 百度：https://dafrok.github.io/vue-baidu-map/#/ 高德：https://elemefe.github.io/vue-amap/#/ 1、安装&快速上手
2.1K20编辑于 2022-10-26 - 来自专栏404
在 vue/cli 中使用百度地图 js api
在 vue/cli 中使用百度地图 js api 写在前面 此前使用了 vue-baidu-map，由于业务需求不断迭代，该组件已经无法满足我的需求，并且源码本身就存在缺陷以及缺少维护，因此我选择改为使用百度地图
1.1K10编辑于 2022-04-25 - 来自专栏码艺坊
Vue 3 实战：深度集成百度地图 (Baidu Map) —— 打造智慧城市充电站分布图
本文将基于Vue3和vue-baidu-map(或兼容Vue3的版本)，带你从零实现一个功能完备的地图组件。我们将以“城市充电站分布”为例，涵盖以下核心功能：地图初始化与控件：加载地图、路况图层。
45210编辑于 2026-01-12 - 来自专栏开源部署
Vue常用经典开源项目汇总参考
vue-google-signin-button ★55 - 导入谷歌登录按钮vue-svgicon ★53 - 创建svg图标组件的工具vue-float-label ★49 - VueJS浮动标签模式vue-baidu-map
7.4K11编辑于 2022-08-19 - 来自专栏JAVA乐园
前后端通吃，vue大全Mark一下
Socket.io+Express/Koa2打造一个智能聊天室 mavonEditor ★179 - 基于Vue的markdown编辑器 vue-carousel-3d ★173 - VueJS的3D轮播组件 vue-baidu-map
7.1K20发布于 2020-06-15
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号