本来一直用着googleMap …… 后来发现google开始做每天做2w5k的api调用限制,就重写一次百度地图的应用。
baiduMap类参考: [url]http://openapi.baidu.com/map/classReference.html[/url]
做的是一个位置信息(城市-区-街道)搜索的功能。发现百度地图调用起来还是很方便的。整理了代码,贴上:
这个是反解析坐标为地址,city district street,这些在客户录入位置信息的时候可以很好的提供搜索作用。
还有一个例子是改自百度API自带的demo,比较好玩。
简单的绘制半径5000米的圆,然后在圆形的bounds里面搜索关键字 酒店。发个截图:
[img]http://dl.iteye.com/upload/attachment/580995/9bd488ff-abf3-325e-a609-1180af22daba.png[/img]
下面这个是api里面的结果面板:
[img]http://dl.iteye.com/upload/attachment/580997/971ace12-8413-3900-bfdd-f65df0fdaf21.png[/img]
代码很简单直接进行调用setSearchCompleteCallback的回调函数写入html就好了。
baiduMap类参考: [url]http://openapi.baidu.com/map/classReference.html[/url]
做的是一个位置信息(城市-区-街道)搜索的功能。发现百度地图调用起来还是很方便的。整理了代码,贴上:
var gc = new BMap.Geocoder();
//拖拽事件;
marker.addEventListener("dragend", function(e){
//alert("拖拽后的位置:" + e.point.lng + ", " + e.point.lat);
$("#this_lat").text(e.point.lat);
$("#this_lng").text(e.point.lng);
var pt = e.point;
//反解析地址
gc.getLocation(pt, function(rs){
var addComp = rs.addressComponents;
$("#local_address").text(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);
});
})
这个是反解析坐标为地址,city district street,这些在客户录入位置信息的时候可以很好的提供搜索作用。
还有一个例子是改自百度API自带的demo,比较好玩。
//范围demo
var circle = new BMap.Circle(point,5000,{fillColor:"blue", strokeWeight: 1 ,fillOpacity: 0.1, strokeOpacity: 0.1});
map.addOverlay(circle);
var local = new BMap.LocalSearch(map, {renderOptions: {map: map, autoViewport: false}});
var bounds = getSquareBounds(circle.getCenter(),circle.getRadius());
local.searchInBounds("酒店",bounds);
//new BMap.Circle(setCenter(center:point));
简单的绘制半径5000米的圆,然后在圆形的bounds里面搜索关键字 酒店。发个截图:
[img]http://dl.iteye.com/upload/attachment/580995/9bd488ff-abf3-325e-a609-1180af22daba.png[/img]
下面这个是api里面的结果面板:
[img]http://dl.iteye.com/upload/attachment/580997/971ace12-8413-3900-bfdd-f65df0fdaf21.png[/img]
代码很简单直接进行调用setSearchCompleteCallback的回调函数写入html就好了。
function go_search(){
var local = new BMap.LocalSearch(map, {renderOptions: {map: map, panel: "results_info"}});
map.panBy(point);
keyword=$("#address_key").val()
local.search(keyword);
local.getResults()
local.setSearchCompleteCallback(function(searchResult){
var poi = searchResult.getPoi(0);
//alert(poi.point.lng+" "+poi.point.lat);
document.getElementById("info").innerHTML = "<b>" + keyword + "</b>" + poi.point.lng + "," + poi.point.lat;
});
}