利用百度地图查询全国地铁线路

最近做了个项目，该项目可以方便查询全国地铁线路，地铁线路上模拟小车到站提醒，点击小车可触发相关事件，使用的有百度地图查询地铁线路，地铁图api，再结合vue-baidu-map

1.判断地铁线路图加载完成

//会有bug产生,切换城市时原来的线路和现在的线路会叠加this.subway.addEventListener("subwayloaded", res => {const lines = this.subway.getLines();})

目前采用的是setTimeout方案

2.点击小车触发相关事件
vue-baidu-map的路书可以实现小车运行时触发点击事件，但当使小车在某处暂停时，
由于bml-lushu的属性landmarkPois初始为[] ，当后面获取到数据后，由于landmarkPois的变化而触发reload方法，导致两辆车出现，所以还是使用原生的路书

 //填入路书信息
const lushu = new BMapLib.LuShu();
lushu.start()
const length = Object.keys(lushu).length;
if (length) {//小车idthis.markId = lushu._marker.da;
}

3.查询条件可筛选
element的cascader不支持懒加载时搜索第一层级联，所以要自定义搜索。首先让输入框可搜索，
设置属性filterable，然后禁用掉原先他自带的搜索

<el-cascaderref="myCascader":props="props":options="options"class="map_select"filterable:before-filter="beforeFilter"@change="handleChange"@input.native="handleFilter"
></el-cascader>

 beforeFilter(value) {//阻止自带的默认筛选return false;},

最后触发input事件自定义搜索的方法，通过改变options实现筛选。
测试过程中发现了一个源码中的报错，点击进去发现源码中的handleExpand方法中报错，然后找到相关的代码，发现只要懒加载过一次后，把原先的搜索条件清空，再去搜索时会发生以下错误，经过排查判断源码，问题是因为当重新搜索条件时应取消上一次的高亮。

this.$refs.myCascader.$refs.panel.activePath = [];

利用百度地图查询全国地铁线路相关推荐

【百度地图API】建立全国银行位置查询系统（四）——如何利用百度地图的数据生成自己的标注...
摘要: 上一章留个悬念,"如果自己没有地理坐标的数据库,应该怎样制作银行的分布地图呢?" 答案就是,利用百度地图上的数据. ---------------------------- ...
利用百度地图API进行车辆查询并用鼠标拾点获取经纬度
利用百度地图API查询公交车线路位置信息以及鼠标取点的经纬度先从官网申请秘钥http://lbsyun.baidu.com/ 2. 如果是用jsp写动态web项目,在jsp页面中引入js库,并且引入 ...
百度地图查询数据结果
百度地图查询数据结果一.分类查询 new BMap.LocalSearch.search(keyword) [{"keyword": "招商银行"," ...
python批量爬取小网格区域坐标系_Python爬虫实例_利用百度地图API批量获取城市所有的POI点...
上篇关于爬虫的文章,我们讲解了如何运用Python的requests及BeautifuiSoup模块来完成静态网页的爬取,总结过程,网页爬虫本质就两步: 1.设置请求参数(url,headers,co ...
利用百度地图，根据经纬度找到对应的具体街道
利用百度地图,根据经纬度找到对应的具体街道最近在做一个数据处理的工作,偶然碰到了要根据经纬度匹配对应的地点.因为百度地图和真实的地理信息比较有一点的差距,于是可以先对数据进行一些处理. 下面上代码 ...
地铁查询-全国地铁查询
一个人到一个城市最重要的是会坐车,快速坐车,特别是地铁,那么怎么样能最快找到这个城市的地铁分布情况呢? 下面我们就推荐一个小程序:地铁查询简介全国地铁查询,全国地铁线路查询,全国地铁站点查询 ...
利用百度地图抓取公交信息实现三维地图车辆跟踪轨迹回放
MapVGL,是一款基于WebGL的地理信息可视化库,是一款基于百度地图的大数据可视化开源库,可以用来展示大量基于3D的地理信息点线面数据.设计初衷主要是为了解决大数据量的三维地理数据展示问题及一些炫 ...
android开发百度地图坐标偏差,利用百度地图Android sdk高仿微信发送位置功能及遇到的问题...
接触了百度地图开发平台半个月了,这2天试着模仿了微信给好友发送位置功能,对百度地图的操作能力又上了一个台阶我在实现这个功能的时候,遇到一些困难,可能也是别人将会遇到的困难,特在此列出 1.在微信发送 ...
百度地图利用位置提供服务器,利用百度地图API获取当前位置信息的实例
利用百度地图API可以做很多事情,个人感觉最核心也是最基础的就是定位功能了.这里分享一个制作的JS可以实现登录网页后定位: var map; var gpsPoint; var baiduPoint; ...

利用百度地图查询全国地铁线路

利用百度地图查询全国地铁线路相关推荐

最新文章

热门文章