Google Maps API地图应用示例分享(google浏览器)

网友投稿 328 2022-06-07


效果(新版Firefox中测试):

代码:

<!DOCTYPE>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Google Map</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function init()
{
// 获取当前位置
navigator.geolocation.getCurrentPosition(function(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
};
var map1;
// 显示地图
map1 = new google.maps.Map(document.getElementById('map'),myOptions);
// 创建标记
var marker = new google.maps.Marker(
{
position:latlng,
map:map1
});
// 设定标注窗口,附上注释文字
var infowindow = new google.maps.InfoWindow(
{
content:"当前位置"
});
// 打开标注窗口
infowindow.open(map1,marker);
});
}
</script>
</head>
<body onload="init()">
<div id="map"><https://p.download-x.com/div>
</body>
</html>

Google Maps JavaScript API v3(参考文档):https:/https://p.download-x.com/developers.google.com/mapshttps://p.download-x.com/documentation/javascript/basics

百度地图API的参考文档:http:/https://p.download-x.com/developer.baidu.com/map/jsmobile.htm


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:浅谈jQuery中 wrap() wrapAll() 与 wrapInner()的差异(jquery笔记)
下一篇:浅析Node在构建超媒体API中的作用
相关文章

 发表评论

暂时没有评论,来抢沙发吧~