vue-bmap-gl 正在参加 2020 年度 OSC 中国开源项目评选,请投票支持!
vue-bmap-gl 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
投票让它出道
已投票
vue-bmap-gl 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」 !
vue-bmap-gl 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」「最积极运营项目」 !
vue-bmap-gl 获得 2020 年度 OSC 中国开源项目评选「最积极运营项目」 !

软件简介

vue-bmap-gl 是一套基于 Vue 2.0 和百度地图 WebGL 版本的地图组件。 该版本在原来的版本上增加对 bmap WebGL1.0 的适配 该项目基于 https://github.com/ElemeFE/vue-amap/ 修改开发。

示例

// 引入vue-bmap-gl
import VueBMap from 'vue-bmap-gl';
import 'vue-bmap-gl/dist/style.css';
Vue.use(VueBMap);

// 初始化vue-amap
VueBMap.initBMapApiLoader({
  // 百度的key
  ak: 'YOUR_KEY',
  // 百度 sdk 版本,默认为 1.0
  v: '1.0'
});

组件

  • el-bmap(地图)
  • el-bmap-bezier-curve(贝塞尔曲线)
  • el-bmap-circle(圆)
  • el-bmap-ground-overlay(地面叠加层)
  • el-bmap-info-window(信息窗口)
  • el-bmap-label(文本标记)
  • el-bmap-marker(标号)
  • el-bmap-marker-3d(3D标号)
  • el-bmap-polygon(多边形)
  • el-bmap-polyline(折线)
  • el-bmap-prism(3D棱柱)
  • el-bmap-menu(右击菜单)
  • el-bmap-track(车辆跟踪)
展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论 (0)

加载中
更多评论
发表了资讯
05/13 17:47

vue-bmap-gl v0.0.16紧急发布

0.0.14版本发布时增加了 BMapGLLib 扩展库,由于加载机制存在问题,紧急发布了0.0.15和0.0.16版本,如果有BMapGLLib使用需求的请将版本更新至0.0.16 0.0.16更新日志: 修复初始化时不添加plugins参数,导致无法初始化地图问题 0.0.15更新日志: 紧急修复plugins加载时存在异步问题导致地图初始化后BMapGLLib组件库没有加载完成 vue-bmap-gl 是一套基于Vue 2.0和百度地图WebGL版本的地图组件。该版本在原来的版本上增加对bmap We...

0
2
发表了资讯
05/11 18:06

vue-bmap-gl v0.0.14 版本发布,接入 BMapGLLib 扩展库,推荐更新

更新内容: * InfoWindowCustom增加open、close事件 * 增加接入BMapGLLib扩展库,可以在初始化时使用plugins参数传入。加载方式:查看 vue-bmap-gl 是一套基于Vue 2.0和百度地图WebGL版本的地图组件。该版本在原来的版本上增加对bmap WebGL1.0的适配,该项目基于 https://github.com/ElemeFE/vue-amap/ 修改开发。...

0
2
发表了资讯
04/23 15:32

vue-bmap-gl v0.0.13 版本发布,修复 bug

更新内容: * 增加map销毁 * 修复地球模式下自定义弹框位置不准确问题 * 固定文档中docsify版本,新版本会导致示例无法加载 vue-bmap-gl是一套基于Vue 2.0和百度地图WebGL版本的地图组件。 该版本在原来的版本上增加对bmap WebGL1.0的适配 该项目基于 https://github.com/ElemeFE/vue-amap/ 修改开发

1
3
发表了资讯
03/16 15:47

vue-bmap-gl v0.0.12 已经发布,地图组件

vue-bmap-gl v0.0.12 已经发布,这是一个地图组件。 此版本更新内容包括: 解决label组件自定义时,一直刷新问题 解决custom infoWindow的offset参数无效问题 解决label自定义模式下,当未初始化完成时更新slot内容导致报错问题 解决label自定义模式下,某些初始化时无内容问题 详情查看:https://gitee.com/guyangyang/vue-bmap-gl/releases/v0.0.12...

0
3
发表了资讯
02/02 19:06

vue-bmap-gl v0.0.10 已经发布,地图组件

vue-bmap-gl v0.0.10 已经发布,这是一个地图组件。 此版本更新内容包括: 地图增加defaultCursor属性 修复polygon修改path时,如果处于edit状态,不会触发拖拽图标问题 详情查看:https://gitee.com/guyangyang/vue-bmap-gl/releases/v0.0.10

0
6
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
发表了博客
2019/10/15 12:07

解决vue中BMap未定义问题

原文链接: 点我 最近在项目中使用了百度地图来显示物流信息,实现方式有两种: 引用Vue Baidu Map 引用BMap 存在的问题:\color{red}{存在的问题:}存在的问题:; 使用BMap可以修改起始点和终点的图标,但是地图需要刷新页面才会显示。 针对以上问题,问题的实现如下所示: Vue文件中的代码 <template>   <div id="myMap"></div> </template> import qs from "qs"; export default { mounted() { this.getMap(); ...

0
0
发表了博客
2019/03/13 16:28

vue + BMap实现常用地图

实现功能: 缩放 自定义icon maker 多个覆盖点的点击事件 获取两点的距离 信息窗口的点击事件 <template> <div id="allmap" ref="mymap"></div> </template> <style scoped> #allmap { width: 100%; height: calc(100vh - 50vw); margin-bottom: 9.3333vw; } .map-wrap /deep/ .anchorBL{ display: none; } </style> <script> import BMap from 'BMap' import loc from ...

0
0
发表了博客
2018/05/29 18:44

vue项目 调用百度地图 BMap is not defined

这次老板新接了一个四点半官网页面,使用vue来写。emm……我感觉整个人都不好了,两天半解决了20个静态页面。还好vue写页面简直飞快,遇到一个vue的新坑,使用百度地图。 研究了好一会,总是报错BMap is not defined 我只有一个页面需要用到地图,所以我是使用cdn引入的方式来写的,并没有像网上一些教程一样使用npm引入安装。 直接简单粗暴的根据百度地图api来写,虽然报错。那就解决报错的bug就行了。好了,下面开始说说步骤 ...

0
0
发表于大前端专区
01/21 14:05

Vue加载百度地图GL版本和mapvgl

1、安装依赖组件 npm install vue-bmap-gl --save npm install vue-mapvgl --save 2、在main.js中加载组件 import VueBMap from 'vue-bmap-gl'; import 'vue-bmap-gl/dist/style.css' import VueMapvgl from 'vue-mapvgl'; Vue.use(VueBMap); Vue.use(VueMapvgl); VueBMap.initBMapApiLoader({ ak: 'YOUR_KEY', v: '1.0' }); 该处的ak对应的值需要在百度的控制台中申请: http://lbsyun.baidu.com/apiconsole/k...

0
2
发表了博客
2019/12/26 17:19

vue 使用百度地图GL - 3D效果

<script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=CWmiAPiwuHW6sGdMbAReZdqU"></script> <template> <div class="drawer"> <div id="allmap" style="width:100%; height:500px;"></div> </div> </template> <script> export default { name: 'HelloWorld', props: {}, data () { return { open: false, isActive: false, isClose: false } }, mo...

0
0
发表了博客
2018/11/14 18:55

解决Vue引入百度地图JSSDK:BMap is undefined 问题

<p>百度地图官网文档介绍使用JSSDK时,仅提供了2种引入方式:</p> <ul> <li>script引入</li> <li>异步加载</li> </ul> <a href="http://www.jqhtml.com/19622.html" target="_blank">解决跨域问题,实例调用百度地图</a> <p>但vue项目中仅某一两个页面需要用到百度地图,所以不想在 <code>index.html</code> 中全局引用。</p> <p>那在单个vue组件页面中如何引入呢?</p> <p>刚开始时,是直接通过 DOM 操作方式插入script标签到当...

0
0
发表于开发技能专区
2019/10/28 22:39

mapbox gl: Vue单页面组件

使用Vue开发地图的时候,鉴于也不熟悉Vue,就将mapbox gl以单页面的形式做成了组件,共享map实例进行地图操作开发。 具体的实现如下: 安装mapbox gl 类库:通过npm install mapbox-gl --save安装类库,或者国内的cnpm也可以。 新建Vue的模版页:div承载mapbox gl地图 <template> <div> <div ref="basicMapbox"></div> </div> </template> 通过脚本代码添加mapbox的对象:需要在mounted里,进行mapbox gl的初始化,container属性...

0
0
发表了博客
2020/04/14 13:50

Vue - Vue-CLI2 和 Vue-CLI3、Vue-CLI4的区别

周末在家新建了一个 Vue 测试项目,但不管怎么建,总会提示一些 有的没的,杂七杂八的信息,如:找不到 funding、存在多少漏洞(vulnerabilities) 什么的。如下所示: 寻思着,出现这些问题的原因,应该是一些 不太重要的依赖包 更新了版本 或 迁移了地址,导致之前的 Vue-CLI 找不到 对应的版本 或 依赖包地址了。 虽然暂时没发现这些错误对项目的运行和打包有啥影响,但是一句话,看着不爽。既然看着不爽,就想收拾它,怎么收拾...

0
3
2020/11/19 00:00

VUE|Vue实例

欢迎点击「算法与编程之美」↑关注我们! 本文首发于微信公众号:"算法与编程之美",欢迎关注,及时了解更多此系列文章。 欢迎加入团队圈子!与作者面对面!直接点击! 1.创建一个Vue实例 之前初步学习了Vue的安装和一些简单介绍,这次就主要学习Vue实例。 每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的。 var vm = new Vue({ // 选项 }) 虽然没有完全遵循 MVVM 模型,但是 Vue 的设计也受到了它的启发。因此在...

0
1
发表了博客
2018/04/27 14:00

Vue--vue-Router

一.vue路由的基本使用 为什么需要路由? 因为我们通过component切换组件无法给组件传递参数 component切换组件 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 <script src="../vue2.4.4.js"></script> 9 </head...

0
1
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
暂无内容
0 评论
17 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部