在上一篇文章《[GIS（五）——完成js版搜狗地图基本交互搜索功能](http://blog.csdn.net/xiaoxian8023/article/details/39503017)》中，介绍了搜狗地图的关键字搜索功能，今天就实现以下另一个重要功能吧——那就是周边搜索功能。
按照惯例，还是把官网上的示例代码给大家贴出来。[飞机票](http://map.sogou.com/api/documentation/javascript/api2.5/examples_doc/search_3.html)在此。周边搜索的功能，跟关键字搜索其实是一样的，也是主要用到的了SearchRequest这个类，点击[这里](http://map.sogou.com/api/documentation/javascript/api2.5/reference_service.html#search_request)查看api文档。SearchRequest 对象规范：
| 属性 | 类型 | 说明 |
|-----|-----|-----|
| `map` | `Map` | 进行搜索的地图实例 |
| `renderer` | `[SearchRenderer](http://map.sogou.com/api/documentation/javascript/api2.5/reference_service.html#service_srender)` | 将结果进行渲染的对象。也可以通过setRenderer方法设置 |
| `range` | `object` | 必选。表示查询范围。范围有多个属性，用于不同范围的查询`{ city:城市<String>, boundFlag:0|2(0代表视野所在的城市内搜索; 2代表视野内搜索)<Number>, center:以中心点查询<LatLng |Point>, radius:以中心点进行查询时指定半径<Number>,limit:0|1(指定半径时有效，代表是否严格限制半径。0代表不限制，1代表限制)<Number> }` |
| `what` | `object` | 必选。表示要查询的内容。有三个属性`{ keyword:关键字<String>, classid:[分类id](http://map.sogou.com/api/documentation/javascript/api2.5/sort.html)<String>, id:uid或者dataid<String> }`, 分类id:普通数字代表小类id，前缀加C_的代表大类id。查询时关键字与分类id 可以联合查询。id 只能单独查询，如果存在id属性，就只按id查询。 【[查看所有分类id](http://map.sogou.com/api/documentation/javascript/api2.5/sort.html)】 |
| `clientid` | `String` | 可选。为用户提供更稳定的服务。【[查看详情](http://map.sogou.com/api/documentation/javascript/api2.5/clientid.html)】 |
从api文档中也可以看到，range这个参数是用来限定搜索范围的，而what制定查询内容的。所以只要我们想查什么，就要去找它的分类id，然后再进行检索。
好了，要了解的也就这么多，接下来就是代码实现部分了。
在原先的代码，添加一个对象，用来将结果渲染到右侧列表中：
~~~
var sRender_area;//搜索周边渲染对象
~~~
在initialize方法中，添加创建周边搜索的渲染对象：
~~~
function initialize(){
//....
sRender=new sogou.maps.SearchRenderer();//创建搜索渲染对象
sRender_area=new sogou.maps.SearchRenderer();//创建周边搜索渲染对象
}
~~~
添加一个搜索周边的方法：
~~~
//搜索周边
function search_area(classid){
clearMarker(sRender_area);//清除定位标记
clearMarker(sRender);
var request={
'map':map,
'what':{
'classid':classid
},
'range':{
'city':'北京',
'center':new sogou.maps.Point(center.x,center.y),
'radius':1000,
'limit':1 //严格限制半径
}
};
var search=new sogou.maps.Search();//创建搜索实例
search.search(request);
sRender_area=new sogou.maps.SearchRenderer({'panel':document.getElementById('result')});
search.setRenderer(sRender_area);
}
~~~
js都修改完了，添加上搜索周边的按钮：
~~~
<!--搜索周边-->
<input type="button" onclick="search_area('1228,1403,1330,1332')" value="周边餐饮" />
<input type="button" onclick="search_area('97,1264,1262')" value="周边公交" />
<input type="button" onclick="search_area('83,1321,1259')" value="周边商场" />
<input type="button" onclick="search_area('C_32')" value="周边酒店" />
<input type="button" onclick="search_area('1261')" value="周边医院" />
~~~
效果图如下：
[点击这里到网站上查看](http://mfxuan.free.800m.net/search_ok.html)
周边搜索和关键字搜索都是同一个，只不过设定的参数不一致。而且我可以同时设定关键字和周边搜索，进行范围更小更精确的搜索。只是用的话，其实没什么太大的难度，只要按照官方的api文档和示例代码就可以了解怎么开发了。
上面提到的都是从技术的角度来验证问题，如果真正使用的时候，最起码还是要提供智能提示的功能。界面也不能这么简陋，下一篇文章，我将解决这2个问题。敬请期待吧。
