关键点,【百度地图API】如何用圆形搜索获取中心点周围100米内全部关键点?如天安门附近所有的餐厅、加油站、宾馆、大厦等

摘要:
在LBS上有这样一个常用的功能,查找附近所有的关键点(POI点,比如标志性建筑物,餐厅,大厦,加油站等)。相信大家对search已经非常熟悉了,可是search必须要传“关键字”参数,即使是多关键字搜索,也要把所有POI的tag都一一列举出来,才能搜索到结果。那么,有没有什么办法,可以不用关键字,就搜索到附近全部的POI呢?
答案是肯定的。我们一起来学习一下吧~
-----------------------------------------------------------------------------------------------------------------------------------
示例“搜索在天安门附近500米的12个POI点”。
参数分析:
中心点:天安门
半径:500米
POI上限数:12

先来看看效果图。
【百度地图API】如何用圆形搜索获取中心点周围100米内全部关键点?如天安门附近所有的餐厅、加油站、宾馆、大厦等关键点
--------------------------------------------------------------------------------------------------------------------------------------
一、创建地图和网页样式
1、三句话地图:
创建地图容器,创建点,设置中心点和地图级别。
var map = new BMap.Map("container"); var mPoint = new BMap.Point(116.404, 39.915); map.centerAndZoom(mPoint, 16);

2、启动滚轮缩放
这一条非必须,我只是觉得这样查看地图比较方便。
map.enableScrollWheelZoom(); //启用滚轮缩放

3、网页结构
一个确定按钮、一个地图容器、一个结果面板
="displayPOI();" value="确定" />



二、使用地址解析得到所有POI点
在类参考里,我们找到这样一个接口surroundingPois,我们利用这个接口,来得到全部的POI点。
【百度地图API】如何用圆形搜索获取中心点周围100米内全部关键点?如天安门附近所有的餐厅、加油站、宾馆、大厦等关键点

所以,我们先创建一个地址解析实例:
var myGeo = new BMap.Geocoder(); //创建地址解析实例



然后使用反地址解析的方法,来看一下代码和类参考:
myGeo.getLocation(mPoint, mCallback(rs),mOption);

【百度地图API】如何用圆形搜索获取中心点周围100米内全部关键点?如天安门附近所有的餐厅、加油站、宾馆、大厦等关键点
如上图类参考所示,有3个参数:point , callback 和 options。
第一个参数是指定坐标点,这里我们指定的是天安门的坐标。
var mPoint = new BMap.Point(116.404, 39.915);

第二个参数是回调函数,用来打印查询结果,和添加圆形覆盖物的。surroundingPoi会返回Array,LocalResultPoi的部分属性如下:
【百度地图API】如何用圆形搜索获取中心点周围100米内全部关键点?如天安门附近所有的餐厅、加油站、宾馆、大厦等关键点
我们打印出需要的部分即可,比如标题和地址,代码如下:
document.getElementById("panel").innerHTML += "" + (i+1) + "、" + allPois[i].title + ",地址:" + allPois[i].address + "
"; map.addOverlay(new BMap.Marker(allPois[i].point)); //添加圆形覆盖物

第三个参数是用来定义半径和POI数量的。
【百度地图API】如何用圆形搜索获取中心点周围100米内全部关键点?如天安门附近所有的餐厅、加油站、宾馆、大厦等关键点
var mOption = { poiRadius : 500, //半径为1000米内的POI,默认100米 numPois : 12 //列举出50个POI,默认10个 }



---------------------------------------------------------------------------------------------------------------------------------------------------

全部源代码:
所有POI的查�-地址解析 ="displayPOI();" value="确定" />


Tags: 

延伸阅读

最新评�

发表评论