以上就是本篇文章【html5在网页中调用百度地图】的全部内容了，欢迎阅览 ！ 文章地址：http://yybeili.xhstdz.com/quote/83704.html
栏目首页
相关文章
动态
同类文章
热门文章
网站地图
返回首页 物流园资讯移动站 http://yybeili.xhstdz.com/mobile/ , 查看更多
html5在网页中调用百度地图
2024-12-08 18:03
html5在网页中调用百度地图
调用
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>在网页中调用百度地图</title>
<!--<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false">
</script>-->
<script type="text/javascript" src=src="http://api.map.baidu.com/api?key=*&v=1.0&services=true"></script>
</head>
<body οnlοad="init()">
<div id="map" width="800" height="600"></div>
<script>
function init(){
if(navigator.geolocation){
//获取当前地理位置
navigator.geolocation.getCurrentPosition(showposition,showerror);
}
else{
alert("您的浏览器不支持获取地理位置信息！");
}
}
//获取当前地理位置
function showposition(position){
var coords=position.coords;
//指定一个谷歌地图上的坐标点，同时指定该坐标点的横坐标和纵坐标,显示谷歌地图
var latlng=new google.maps.LatLng(coords.latitude,coords.longitude);
var myOptions={
zoom:14,//设定放大倍数
center:latlng,//将地图中心设定为指定的坐标点
mapTypeId:google.maps.mapTypeId.ROADMAP//指定地图类型
};
//创建地图，并在页面map中显示，
var map=new google.maps.Map(document.getElementById("map"),myOptions);
//在地图上创建标记
var marker=new google.maps.Marker({
position:latlng,//将前面设定的坐标标注出来
map:map//将该标注设置在刚才创建的map中
}
);
//标注提示窗口
var infoWindow=new google.maps.InfoWindow({
content:"当前位置：<br/>经度："+latlng.lat()+"纬度："+latlng.lng()//提示窗体信息
});
//打开提示窗口
infoWindow.open(map,marker);
}
function showerror(error){
//处理错误
//
case 1:
//
alert("服务位置被拒绝！");break;
//
case 2:
//
alert("暂时获取不到位置信息！");break;
//
case 3:
//
alert("获取信息超时！");break;
//
default:
//
alert("未知错误");break;
alert(error.code+" "+error.message);
}
</script>
</body>