Google Maps API地圖應(yīng)用示例分享
效果(新版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()
{
// 獲取當(dāng)前位置
navigator.geolocation.getCurrentPosition(function(position)
{
var coords = position.coords;
// 設(shè)定地圖參數(shù),將當(dāng)前位置的經(jīng)緯度設(shè)置為中心點(diǎn)
var latlng = new google.maps.LatLng(coords.latitude,coords.longitude);
var myOptions =
{
// 放大倍數(shù)
zoom:14,
// 標(biāo)注坐標(biāo)
center:latlng,
// 地圖類型
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map1;
// 顯示地圖
map1 = new google.maps.Map(document.getElementById('map'),myOptions);
// 創(chuàng)建標(biāo)記
var marker = new google.maps.Marker(
{
position:latlng,
map:map1
});
// 設(shè)定標(biāo)注窗口,附上注釋文字
var infowindow = new google.maps.InfoWindow(
{
content:"當(dāng)前位置"
});
// 打開標(biāo)注窗口
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
相關(guān)文章
ionic js 復(fù)選框 與普通的 HTML 復(fù)選框到底有沒區(qū)別
本文通過實(shí)例給大家演示ionic js 復(fù)選框 與普通的 HTML 復(fù)選框到底有沒區(qū)別的相關(guān)知識,非常不錯具有參考借鑒價(jià)值,感興趣的朋友一起學(xué)習(xí)吧2016-06-06JS中實(shí)現(xiàn)replaceAll的方法(實(shí)例代碼)
本文是對JS中實(shí)現(xiàn)replaceAll的方法進(jìn)行了詳細(xì)的總結(jié)介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-11-11javascript DOM實(shí)用學(xué)習(xí)資料
比較詳細(xì)的實(shí)例分析了dom的一些常用方法2008-09-09svg插入foreignObject無法響應(yīng)事件解決
這篇文章主要為大家介紹了svg插入foreignObject無法響應(yīng)事件解決,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10跟我學(xué)習(xí)javascript的浮點(diǎn)數(shù)精度
跟我學(xué)習(xí)javascript的浮點(diǎn)數(shù)精度,帶大家真正的理解JavaScript的浮點(diǎn)數(shù),提醒大家當(dāng)心浮點(diǎn)運(yùn)算中的精度陷阱,需要的朋友可以參考下2015-11-11javascript制作的網(wǎng)頁側(cè)邊彈出框思路及實(shí)現(xiàn)代碼
這篇文章主要介紹了javascript制作的網(wǎng)頁側(cè)邊彈出框思路及實(shí)現(xiàn)代碼,需要的朋友可以參考下2014-05-05