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

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

摘要:

  在LBS上有这样一个常用的功能,查找附近所有的关键点(POI点,比如标志性建筑物,餐厅,大厦,加油站等)。相信大家对search已经非常熟悉了,可是search必须要传“关键字”参数,即使是多关键字搜索,也要把所有POI的tag都一一列举出来,才能搜索到结果。那么,有没有什么办法,可以不用关键字,就搜索到附近全部的POI呢?

  答案是肯定的。我们一起来学习一下吧~

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

示例“搜索在天安门附近500米的12个POI点”。

参数分析:

中心点:天安门

半径:500米

POI上限数:12

先来看看效果图。

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

一、创建地图和网页样式

1、三句话地图:

创建地图容器,创建点,设置中心点和地图级别。

var map = new BMap.Map("container");var mPoint = new BMap.Point(116.404, 39.915);map.centerAndZoom(mPoint, 16);

  

2、启动滚轮缩放

这一条非必须,我只是觉得这样查看地图比较方便。

map.enableScrollWheelZoom();        //启用滚轮缩放

  

3、网页结构

一个确定按钮、一个地图容器、一个结果面板

<input type="button" onclick="displayPOI();" value="确定" /><div style="width:600px;height:340px;border:1px solid gray;float:left;" id="container"></div><div style="width:300px;height:340px;border:1px solid gray;border-left:0;float:left;" id="panel"></div>

  

二、使用地址解析得到所有POI点

在类参考里,我们找到这样一个接口surroundingPois,我们利用这个接口,来得到全部的POI点。

所以,我们先创建一个地址解析实例:

var myGeo = new BMap.Geocoder();        //创建地址解析实例

  

然后使用反地址解析的方法,来看一下代码和类参考:

  

myGeo.getLocation(mPoint, mCallback(rs),mOption);

  

如上图类参考所示,有3个参数:point , callback 和 options。

第一个参数是指定坐标点,这里我们指定的是天安门的坐标。

var mPoint = new BMap.Point(116.404, 39.915);

  

第二个参数是回调函数,用来打印查询结果,和添加圆形覆盖物的。surroundingPoi会返回Array<LocalResultPoi>,LocalResultPoi的部分属性如下:

我们打印出需要的部分即可,比如标题和地址,代码如下:

document.getElementById("panel").innerHTML += "<p style='font-size:12px;'>" + (i+1) + "、" + allPois[i].title + ",地址:" + allPois[i].address + "</p>";map.addOverlay(new BMap.Marker(allPois[i].point));  //添加圆形覆盖物

  

第三个参数是用来定义半径和POI数量的。

var mOption = {    poiRadius : 500,           //半径为1000米内的POI,默认100米    numPois : 12                //列举出50个POI,默认10个}

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

全部源代码:

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>所有POI的查询-地址解析</title><script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script></head><body><input type="button" onclick="displayPOI();" value="确定" /><div style="width:600px;height:340px;border:1px solid gray;float:left;" id="container"></div><div style="width:300px;height:340px;border:1px solid gray;border-left:0;float:left;" id="panel"></div></body></html><script type="text/javascript">var map = new BMap.Map("container");var mPoint = new BMap.Point(116.404, 39.915);map.centerAndZoom(mPoint, 16);map.enableScrollWheelZoom();        //启用滚轮缩放

var mOption = {    poiRadius : 500,           //半径为1000米内的POI,默认100米    numPois : 12                //列举出50个POI,默认10个}

var myGeo = new BMap.Geocoder();        //创建地址解析实例function displayPOI(){    map.addOverlay(new BMap.Circle(mPoint,500));        //添加一个圆形覆盖物    myGeo.getLocation(mPoint,function mCallback(rs){var allPois = rs.surroundingPois;       //获取全部POI(该点半径为100米内有6个POI点)            for(i=0;i<allPois.length;++i){                document.getElementById("panel").innerHTML += "<p style='font-size:12px;'>" + (i+1) + "、" + allPois[i].title + ",地址:" + allPois[i].address + "</p>";                map.addOverlay(new BMap.Marker(allPois[i].point));                            }        },mOption    );}

</script>

  

时间: 2024-09-28 05:14:36

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

Android中使用百度地图API:城市POI搜索-获取所有结果

本文主要讲解如何通过百度地图API搜索得到一个城市里的所有POI.这里有必要对"所有"这个词进行强 调一下,以便引起重视,之所以这样说,是因为在搜索POI时,默认仅返回一页的搜索结果10条,那么如何才 能得到所有的搜索结果呢?其实baidu map api是提供了相关的方法,但我发现有相当多的网友都在问这个问 题,所以有必要讲解演示一下. 先讲一下什么称之为"城市POI搜索"?它与我们在上一篇文章([011] 百 度地图API之POI搜索-发现你身边的兴趣点,如超市

百度地图api应用之周边搜索实例

 代码如下 复制代码   对地图还是入门的认识,来个小小demo: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>百度地图Api - 周边搜索</title> <!-- 引入地图api --> <script t

【百度地图API】如何根据摩卡托坐标进行POI查询,和计算两点距离

原文:[百度地图API]如何根据摩卡托坐标进行POI查询,和计算两点距离 摘要: 百度地图API有两种坐标系,一种是百度经纬度,一种是摩卡托坐标系.在本章你将学会: 1.如何相互转换这两种坐标: 2.使用该坐标进行反地址解析: 3.坐标附近全部POI的查询: 4.计算两点间的距离. ------------------------------------------------------------------------------ 最终画面效果图   百度地图API常用两种坐标系,一是球面

【百度地图API】交你如何用百度地图搜索自己的数据!不需数据库!

原文:[百度地图API]交你如何用百度地图搜索自己的数据!不需数据库! 摘要: 我有一定的房产数据,还有银行数据.我想在百度地图上标注出来,并且能搜索到我这些数据. 可是百度的数据库上并没有我的数据.我应该怎么办呢? ------------------------------------------------------------------------------------------ 一.无需数据库,如何建立自己的地理信息表. 如果让初学者去建立数据库,那么意味着大家还要学习数据库,

Android中使用百度地图API:公交换乘方案搜索

这是我写的第3篇介绍调用百度地图API搜索服务的文章,所以对搜索前要做的其它工作不再介绍,再加上 代码中的注释也对相关的操作.方法做了尽可能详细的说明,所以直接看示例吧. 1)布局文件 res/layout/main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/andro

凨-百度地图API之地图标注(JS版),地理位置信息,根据地址获取经度纬度

使用的时候记得更改百度地图的开发者KEY <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>凨-百度地图API之地图标注(JS版),地理位置信息,根据地址获取经度纬度</title> <script type="text

百度地图API之本地搜索与范围搜索_javascript技巧

地图服务是指可以提供数据信息的接口,比如说本地搜索/路线规划等,下面小编给大家整理下百度地图API之本地搜索和范围搜索,具体请看下文. 地图服务概述 地图服务是指那些提供数据信息的接口,比如本地搜索.路线规划等等.百度地图API提供的服务有: LocalSearch:本地搜索,提供某一特定地区的位置搜索服务,比如在北京市搜索"公园".TransitRoute:公交导航,提供某一特定地区的公交出行方案的搜索服务.DrivingRoute:驾车导航,提供驾车出行方案的搜索服务.Walkin

【百度地图API】如何使用suggestion--下拉列表方式的搜索建议

原文:[百度地图API]如何使用suggestion--下拉列表方式的搜索建议 摘要: 百度地图上有一个很强大的搜索建议功能,以下拉列表的方式展示出来.比如,输入"百度",下拉列表中就会出现"北京市海淀区百度在线网络技术(北京)有限公司".这个如何实现呢?让我们一步一步来学习. -----------------------------------------------------------------------------------------------

【百度地图API】如何制作公交线路的搜索?如331路

原文:[百度地图API]如何制作公交线路的搜索?如331路 摘要: 从A点到B点的公交导航大家都知道怎么做了,那么单独查询331路公交车的公交路线,如何制作呢?我们一起来学习一下~ ----------------------------------------------------------------------------------------------------------------- 一.创建地图和网页样式 两句话建立地图: var map = new BMap.Map("