手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Google Maps API地图应用示例分享
Google Maps API地图应用示例分享
摘要:效果(新版Firefox中测试):代码:GoogleMapfunctioninit(){//获取当前位置navigator.geolocat...

效果(新版Firefox中测试):

Google Maps API地图应用示例分享1

代码:

<!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"></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"></div>

</body>

</html>

Google Maps JavaScript API v3(参考文档):https://developers.google.com/maps/documentation/javascript/basics

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

【Google Maps API地图应用示例分享】相关文章:

根据内容自动调整弹出窗口大小的JS解决方案

JavaScript中exec函数用法实例分析

JavaScript通过Date-Mask将日期转换成字符串的方法

javascript中CheckBox全选终极方案

js输入中文效果

js+cookies实现悬浮购物车的方法

在textarea输入Tab

JavaScript中的sub()方法的使用介绍

javaScript中slice函数用法实例分析

javaScript中with函数用法实例分析

精品推荐
分类导航