==获取地理位置的方式:
1、GPS(全球定位系统)
2、手机信号(移动通信基站)
3、wiFi或蓝牙(wifi信号发射装置都有一个全球唯一的MAC地址)
4、IP地址(链接互联网时,每台设备都有一个独一无二的IP地址)
==用geolocation对象定位(针对百度地图):
var geolocation = new BMap.Geolocation( );//1、先获取geolocation 对象
geolocation.getCurrentPosition( successCallback, errorCallback);//2、对象掉定位方法,定位成功执行successCallback函数,失败执行errorCallback函数(参数可不填)
function successCallback(position){
var coords = position.coords;//coords属性返回经纬度对象
var longitude = coords.longitude;//经度
var latitude = coords.latitude;//纬度
var accuracy = coords.accuracy;//精确度
}//定位成功将要执行的函数
function errorCallback(error){
switch(error.code){
case 3:
alert("超时,请重试!");
break;
case 2:
alert("位置信息不可用!");
break;
case 1:
alert("用户拒绝了该浏览器的位置信息请求!");
break;
case 0:
alert("未知错误!");
break;
}
}//定位失败将要执行的函数
==还可添加配置对象为第三个参数
{
enableHighAcuracy : true,//指示浏览器获取高精度位置,默认为false
timeout : 5000,//指定获取位置超时时间,默认不限时,单位毫秒
maximumAge : 10000//指定多久重复获取位置
}
==getCurrentPosition方法与watchPosition方法的区别:
getCurrentPosition这个函数只会执行一次,
watchPosition这个函数只有设备的位置发生变化,才会执行成功函数。
==用JS初始化地图
var map = new BMap.Map("map");//创建地图对象,id为"map"的div,且div的宽高为100%,且div的父亲必须有宽高。
map.centerAndZoom("北京",100);//初始化地图,设置中心和缩放比例。
==Map对象的常见方法:
enableDragging() / disableDragging()===>启用/禁用地图拖拽
enableScrollWheelZoom() / disableScrollWheelZoom()===>启用/禁用滚轮缩放大小
enableKeyboard() / disableKeyboard()===>启用/禁用键盘上下键移动地图
enableDoubleClickZoom() / disableDoubleClickZoom()===>启用/禁用双击放大
getCenter===>返回当前的中心点对象
==百度地图API常用控件
NavigationControl====>平移缩放控件
ScaleControl====>比例尺控件
MapTypeControl====>地图类型控件(只有设置为城市时有用)
PanoramaControl====>全景控件(全景效果在本地打开可能没有效果,放在服务器环境即可。)
==向地图中添加控件
map.addControl(new BMap.NavigationControl());//平移缩放控件
map.addControl(new BMap.ScaleControl());//比例尺控件
map.addControl(new BMap.MapTypeControl());//地图类型控件
map.addControl(new BMap.PanoramaControl());//全景控件
==向地图中添加或移出事件
addEventListener====>添加事件
removeEventListener====>移出事件
==常用事件:
click====>单击事件
dbclick====>双击事件
dragend====>拖动结束
zoomend====>缩放结束
load====>加载完成
==从点击事件中获取地点坐标信息:
map.addEventListener("click",function( event ){
var longitude = event.point.ang;//获取经度
var latitude = event.point.lat;//获取纬度
});
==添加标注
==默认标注
var marker = new BMap.Marker(point);//创建标注
map.addOverlay(marker);//将标准添加到地图中
==自定义标注
var mymarker = new BMap.lcon('img/1.jpg',new BMap.Size(100,100));//创建自定义图标对象和对象尺寸
var marker = new BMap.Marker(point,{icon:mymarker});//创建标注
map.addOverlay(marker);//将标准添加到地图中
marker.enableDragging();//使标注可以被鼠标拖动
==获取当前标注的位置
var position = marker.getPosition();
var lon = position.lng;//获取标注点的位置信息
var la = position.lat;//获取标注点的位置信息
==使用信息窗口作为标注
var infoWindow = new BMap.InfoWindow('hallo world');//创建信息窗口对象
map.openInfoWindow(infoWindow,point);//打开信息窗口
==将输入的地址解析为坐标点对象
var myGeo = new BMap.Geocoder();//创建地址解析器实例
myGeo.getPoint("成都",function(point){
map.centerAndZoom(point,100);
map.addOverlay(new BMap.Marker(point));
});//将解析的结果显示在地图上并调整视野
==地址逆解析
var myGeo = new BMap.Geocoder();//创建地址解析实例
myGeo.getLocation(point,function(result){
var addComp = result.addressComponents;
var procince = addComp.procince;//省份
var city = =addComp.city;//成市
var street = addComp.street;//街道
var streetnumber = addComp.streetnumber;//街道号码
});//逆解析坐标点,通常结合点击事件
map.addEventListener("click", function(event) {
//当用户点击某个位置时,就在这个位置创建一个标注。
// console.log(event.point);
// var marker = new BMap.Marker(event.point);
// this.addOverlay(marker);
//将坐标点解析为地址
var geocoder = new BMap.Geocoder();
geocoder.getLocation(event.point, function(result) {
// console.log(result)
var infowindow = new BMap.InfoWindow(result.address);
map.openInfoWindow(infowindow, event.point);
});
});
==步行线路规划
var walking = new BMap.WalkingRoute(map, {
renderOptions: {
map: map, //路线显示的地图
autoViewport: true, //自动调整视野
panel: 'result_display', //将结果显示在id为result_display的div中
}
});
walking.search('天府广场', '春熙路');
==公交线路规划
var transit = new BMap.TransitRoute(map, {
renderOptions: {
map: map,
autoViewport: true,
panel: "result_display",
}
});
transit.search('天府广场', '磨子桥', BMAP_TRANSIT_POLICY_LEAST_TIME);
BMAP_TRANSIT_POLICY_LEAST_TIME===>时间最少
BMAP_TRANSIT_POLICY_LEAST_TRANSFER===>换乘最少
BMAP_TRANSIT_POLICY_LEAST_WALKING====>最少步行
BMAP_TRANSIT_POLICY_AVOID_SUBWAYS====>不乘地铁
==驾车线路规划
var driving = new BMap.DrivingRoute(mp, {
renderOptions: {
map: mp,
autoViewport: true,
panel: "result_display",
}
});
driving.search(‘天府广场’, ’磨子桥’, BMAP_DRIVING_POLICY_LEAST_TIME);
BMAP_DRIVING_POLICY_LEAST_TIME====>时间最少
BMAP_DRIVING_POLICY_LEAST_DISTANCE====>距离最短
BMAP_DRIVING_POLICY_AVOID_HIGHWAYS====>不走高速