vue 百度地图实现标记多个maker,并点击任意一个maker弹出对应的提示框信息, (附: 通过多个地址,标记多个marker 的 方法思路)

通过点击不同筛选条件,筛选出不同企业所在的地点, 根据每个企业的经纬度 在地图上标记多个maker,点击任意一个maker,会弹出infoWindow 信息窗口;

说明:  因每个人写法不同、需求不同, 部分代码 未提供 复制粘贴 需要

参考:  百度地图API

1、初始化地图

this.baiduMap = new BMap.Map("allMap",{minZoom:10,maxZoom:20}); // 创建地图实例

this.baiduMap.enableScrollWheelZoom(true); //开启鼠标滚轮缩放

this.baiduMap.addControl(new BMap.NavigationControl());

this.baiduMap.addControl(new BMap.ScaleControl());

this.baiduMap.addControl(new BMap.OverviewMapControl());

var point = new BMap.Point(117.183, 39.15); // 创建点坐标

this.baiduMap.centerAndZoom(point, 11); // 初始化地图,设置中心点坐标和地图级别

2、将获取回来的 经纬度数组 arrList  全部标记marker 在地图上; 

注意!!!: 如果获取回来的是一个 ” 地址 “  数组,  需要将地址数组 arrList  批量转换为经纬度, 批量地址转换成  ip 经纬度的方法:  百度地图API: http://lbsyun.baidu.com/jsdemo.htm#i7\_3;

通过  geocodeSearch  中  getPoint  生成的  ip 经纬度 地址  用 数组 存起来 ,  然后 在进行 后面的操作;

3、在地图上标记完 maker 以后, 并实现点击maker 弹出提示窗口;  要随时注意 addOverlay  与   clearOverlays;

点赞
收藏

评论区

加载中...

相关推荐

只要两步,用Python将地址标记在地图上!

大家好,在之前的文章中,很多读者私信对如何将商家地址标记到地图上感兴趣👇本文就将讲解,给你一个地址,如何用Python进行可视化,只需要两步:将地址转成经纬度根据经纬度在地图上标记点一、将地址转成经纬度首先我们需要将地理位置转成经纬度这种统一格式,方便代码去识别。完成这一个需求可以使用爬虫通过在线的经纬度转换网站来实现,也可以使用

vue实现世界疫情地图(点击进入子地图)

点击进入子地图目前只实现了中国模块数据来源,腾讯实时疫情(https://news.qq.com/zt2020/page/feiyan.htm/global),中国疫情网(https://www.ncovchina.com/data.html)原本只想做中国模块,后来想了想,做个世界的吧使用axios和echarts,elementui的

Unity RPG游戏,场景任务的设计

0:讨论群qq群号:390313628unity4.6版本运行1场景任务的设计参考开源赛达尔传说游戏SolarusDX。每个地图存在一个控制脚本,脚本名字mapxxxxxx为地图ID。地图控制器提供标准接口,进入地图事件处理和退出地图事件处理。每次切换场景地图的时候,加载对应的脚本,脚本挂在一个Game

Google Map 开发(三):Google Map 地点搜索功能

开发国内应用当我们需要使用到地图时,首选肯定是高德地图或者百度地图,这是因为它们的地图功能足够强大,对于开发人员来说,更是因为API封装的完善和简单的调用实现,扩展功能强大。如果要开发全球通用的APP,需要集成地图,我们难免会对需要使用的地图SDK进行一番调研,百度和高德并没有全世界范围的地图数据,在亚洲或许还能使用以下,对于需要全球范围内都要

Java分布式锁看这篇就够了

\什么是锁?在单进程的系统中,当存在多个线程可以同时改变某个变量(可变共享变量)时,就需要对变量或代码块做同步,使其在修改这种变量时能够线性执行消除并发修改变量。而同步的本质是通过锁来实现的。为了实现多个线程在一个时刻同一个代码块只能有一个线程可执行,那么需要在某个地方做个标记,这个标记必须每个线程都能看到