1.HTML5获取当前地理位置
HTML5 Geolocation API（地理位置应用程序接口）可以获取当前地理位置，手机端使用GPS，电脑则根据网络定位
检查浏览器是否支持HTML5 Geolocation API
<script type="text/javascript">ifnavigator.geolocation){
alert'浏览器支持GeoLocation!');
}else{
alert'浏览器不支持GeoLocation!');
}</script>
提供了3个调用方法
// 获取用户当前位置void getCurrentPositiononSuccess, onError, options);// 持续获取用户当前位置,showLocation表示回调方法int watchPositionshowLocation, onError, options);// 取消监控, watchId 为watchPosition返回值void clearWatchwatchId);
onSuccess 成功后回调方法（必选）
onError 失败回调方法（可选）
options 其他参数（可选）
options = {
enableHighAccuracy, // boolean，是否要求高精度的地理信息
timeout, // 最大等待时间，默认0毫秒
maximumAge // 应用程序缓存时间}
2.调用百度地图展示
<!DOCTYPE html><html><head><meta charset="utf-8"/> <title>基于HTML5查找地理位置并调用百度API展示</title> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script> <script type="text/javascript">
// 调用HTML5 GeoLocation API获取地理位置
function getLocation){
document.getElementById'container').innerHTML = '正在搜寻中，请稍候。。。'; var options = {
enableHighAccuracy:true,
maximumAge:1000
} ifnavigator.geolocation){ //浏览器支持geolocation
navigator.geolocation.getCurrentPositiononSuccess,onError,options);
}else{ //浏览器不支持geolocation
alert'浏览器不支持GeoLocation!');
}
} // 获取成功
function onSuccessposition){
// 经度
var longitude =position.coords.longitude; // 纬度
var latitude = position.coords.latitude; // 使用百度地图API创建地图实例
var map =new BMap.Map"container"); // 创建一个坐标
var point =new BMap.Pointlongitude,latitude); // 地图初始化，设置中心点坐标和地图级别
map.centerAndZoompoint, 16); // 设置标注的图标,可自己定义图标
var icon = new BMap.Icon"http://api.map.baidu.com/img/markers.png", new BMap.Size23, 25), {
offset: new BMap.Size10, 25), // 定位图标尺寸
imageOffset: new BMap.Size0, 0 - 11 * 25) // 设置图片偏移
});
// 设置标注的经纬度
var marker = new BMap.Markernew BMap.Pointlongitude,latitude),{icon:icon}); // 把标注添加到地图上
map.addOverlaymarker); // 设置点击事件
marker.addEventListener"click", function){
alert"经度:" + longitude + ", 纬度:" + latitude);
});
} // 获取失败
function onErrorerror){
switcherror.code){ case 1:
alert"位置服务被拒绝"); break; case 2:
alert"暂时获取不到位置信息"); break; case 3:
alert"获取信息超时"); break; case 4:
alert"未知错误"); break;
}
}
window.onload = getLocation;</script></head><body>
<p id="container" style="width:640px;height:640px"></p></body></html>
本文讲解了HTML5获取当前地理位置并在百度地图上展示的实例，更多相关内容请关注风君子博客。
相关推荐：
通过php 中的自增id来创建唯一编号类
关于php 优化页面输出，兼容搜索引擎机器人访问的实例的讲解
通过php 调用ffmpeg来获取视频信息
以上就是HTML5获取当前地理位置并在百度地图上展示的实例的详细内容，更多请关注风君子博客其它相关文章！