首先,引入百度api密钥;
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=***你的密钥***"></script>
定义地图区域
<div id="l-map"></div>
<script type="text/javascript" >
// 百度地图API功能
function myFun(result){
map.centerAndZoom(new BMap.Point(ypoint,xpoint),18); //数据库记录的经纬度
}
var myCity = new BMap.LocalCity();
myCity.get(myFun);
function G(id) {
return document.getElementById(id);
}
var map = new BMap.Map("l-map");
var ac = new BMap.Autocomplete( //建立一个自动完成的对象
{"input" : "search_city"
,"location" : map});
ac.addEventListener("onhighlight", function(e){ // 鼠标放在下拉列表上的事件
var str = "";
var _value = e.fromitem.value;
var value = "";
if (e.fromitem.index > -1) {
value = _value.province + _value.city + _value.district + _value.street + _value.business;
}
str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
value = "";
if (e.toitem.index > -1) {
_value = e.toitem.value;
value = _value.province + _value.city + _value.district + _value.street + _value.business;
}
str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
G("searchResultPanel").innerHTML = str;
});
var myValue;
ac.addEventListener("onconfirm", function(e) {
//鼠标点击下拉列表后的事件
var _value = e.item.value;
myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
G("searchResultPanel").innerHTML ="onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
setPlace();
});
function setPlace(){
function myFun(){
var pp = local.getResults().getPoi(0); //获取第一个智能搜索的结果
// get_address(pp.point.lat,pp.point.lng,pp.title,pp.point);
//此处处理点击下拉列表事件
}
var local = new BMap.LocalSearch(map, { //智能搜索
onSearchComplete: myFun
});
local.search(myValue);
}
</script>
通过坐标获取省市县街道等信息,注意:此处的坐标一定要是百度地图中实例化的对象;
var point = new BMap.Point(lng,lat);
var geoc = new BMap.Geocoder();
geoc.getLocation(point, function(rs){
var _value = rs.addressComponents;
var province = _value.province;
var city = _value.city;
var county = _value.district;
var street = _value.street + _value.streetNumber;
alert(province +city +county );
});
通过城市名称获取经纬度;当百度api链接引入之后,可在JS中直接使用
var geoc = new BMap.Geocoder();
geoc.getPoint(city_name, function(rs){
// alert(rs.lng);
baidu(rs.lng,rs.lat)
});
此处是在PHP代码中通过访问百度API接口通过城市名称获取经纬度;
//JS代码
$.post("{:U('')}",{city:city_name},function(data){
var obj = JSON.parse(data);
baidu(obj.lng,obj.lat)
// window.location.href = ''
})
//PHP代码
$data = file_get_contents("http://api.map.baidu.com/geocoder?output=json&key=****你的密钥****&address=".$_POST['city']);
$arr = json_decode($data,true);
$new = json_encode($arr['result']['location']);
print_r($new);
百度地图申请定位操作,此处只展示定位成功操作
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
var lng=r.point.lng;
var lat=r.point.lat;
if(this.getStatus() == BMAP_STATUS_SUCCESS){
var myGeo = new BMap.Geocoder();
// 根据坐标得到地址描述
myGeo.getLocation(new BMap.Point(lng,lat), function(result){
var _value = result.addressComponents;
var province = _value.province;
var city = _value.city;
var county = _value.district;
var street = _value.street + _value.streetNumber;
// alert(province+city+county+street)
$.post("{:U('')}",{lat:lat,lng:lng,province:province,city:city,county:county,street:street,now_city:''},function(data){
if(data=='ok'){
window.location.href = "{:U('')}"
}else{
alert(data)
}
});
});
}
else {
alert('failed'+this.getStatus());
}
},{enableHighAccuracy: true}) //用于精准定位
用户拒绝定位
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(r.accuracy==null){
// alert('您的位置:'+r.point.lng+','+r.point.lat);
// return false
// alert('accuracy null:'+r.accuracy);
// alert('您已拒绝定位,无法继续访问!');
//用户决绝地理位置授权
$.ajax({
url:'/',
type:'POST',
data:{type:'all',lat:lats,lng:lngs},
async:false,
success:function(data){
if(data=="ok"){
window.location.href='{$self}'
}
if(data=="error"){
$.post('');
alert("定位失败,请清理缓存后重新定位!");
}
}
})
return;
}
},{enableHighAccuracy: true})