Google 地圖API Map()構(gòu)造器詳解

更新時(shí)間：2016年08月06日 16:49:31 投稿：lqh

本文主要介紹Google 地圖API Map(),這里對(duì)Map()構(gòu)造器的知識(shí)做了一下整理以及提供簡(jiǎn)單的代碼示例,開發(fā)Google 地圖應(yīng)用的朋友可以參考下

地圖 API Map() 構(gòu)造器

實(shí)例

創(chuàng)建一個(gè) Google 地圖:

<html>
<head>
<script
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
</script>

<script>
function initialize()
{
var mapOpt = {
 center:new google.maps.LatLng(51.508742,-0.120850),
 zoom:5,
 mapTypeId:google.maps.MapTypeId.ROADMAP
 };
var map=new google.maps.Map(document.getElementById("googleMap"),mapOpt);
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>

<body>
<div id="googleMap" style="width:500px;height:380px;"></div>

</body>
</html>

定義和用法

Map() 構(gòu)造器創(chuàng)建了一個(gè)新的地圖并插入到指定的HTML元素中（<div> 元素)。

語(yǔ)法

new google.maps.Map(HTMLElement,MapOptions)

參數(shù)值

參數(shù)	描述
HTMLElement	規(guī)定要把地圖放置在那個(gè) HTML 元素中。
MapOptions	帶有地圖初始化變量/選項(xiàng)的 MapOptions 對(duì)象。

Map()的方法

方法	返回值	描述
fitBounds(LatLngBounds)	None	設(shè)置要包含給定邊界的視口。
getBounds()	LatLng,LatLng	返回當(dāng)前視口的西南緯度/經(jīng)度和東北緯度/經(jīng)度。
getCenter()	LatLng	返回地圖的中心的緯度/經(jīng)度。
getDiv()	Node	返回包含地圖的 DOM 對(duì)象。
getHeading()	number	返回航拍圖像的羅盤航向（支持 SATELLITE 和 HYBRID 地圖類型）。
getMapTypeId()	HYBRID ROADMAP SATELLITE TERRAIN	返回當(dāng)前地圖類型。
getProjection()	Projection	返回當(dāng)前 Projection（投影）。
getStreetView()	StreetViewPanorama	返回綁定到地圖的默認(rèn)的 StreetViewPanorama。
getTilt()	number	返回航拍圖像的入射角度數(shù)（支持 SATELLITE 和 HYBRID 地圖類型）。
getZoom()	number	返回地圖的當(dāng)前縮放級(jí)別。
panBy(xnumber,ynumber)	None	通過(guò)以像素計(jì)的給定距離改變地圖的中心。
panTo(LatLng)	None	改變地圖的中心為給定的 LatLng。
panToBounds(LatLngBounds)	None	將地圖平移所需的最小距離以包含給定的 LatLngBounds。
setCenter(LatLng)	None
setHeading(number)	None	設(shè)置航拍圖像的羅盤方向（以度為單位進(jìn)行測(cè)量），基本方向?yàn)楸狈健?/td>
setMapTypeId(MapTypeId)	None	改變要顯示的地圖類型。
setOptions(MapOptions)	None
setStreetView(StreetViewPanorama)	None	綁定一個(gè) StreetViewPanorama 到地圖上。
setTilt(number)	None	設(shè)置航拍圖像的入射角度數(shù)（支持 SATELLITE 和 HYBRID 地圖類型）。
setZoom(number)	None

Map()的屬性

屬性	類型	描述
controls	Array.<MVCArray.<Node>>	要附加到地圖上的額外控件。
mapTypes	MapTypeRegistry	按字符串 ID 劃分的 MapType 實(shí)例的注冊(cè)表。
overlayMapTypes	MVCArray.<MapType>	要疊加的額外地圖類型。

Map()的事件

事件	參數(shù)	描述
bounds_changed	None	當(dāng)可視區(qū)域范圍更改時(shí)會(huì)觸發(fā)此事件。
center_changed	None	當(dāng)?shù)貓D center（中心）屬性更改時(shí)會(huì)觸發(fā)此事件。
click	MouseEvent	當(dāng)用戶點(diǎn)擊地圖（但不是點(diǎn)擊標(biāo)記或信息窗口）時(shí)會(huì)觸發(fā)此事件。
dblclick	MouseEvent	當(dāng)用戶雙擊地圖時(shí)會(huì)觸發(fā)此事件。請(qǐng)注意，觸發(fā)此事件前還會(huì)觸發(fā)點(diǎn)擊事件。
drag	None	當(dāng)用戶拖動(dòng)地圖時(shí)會(huì)反復(fù)觸發(fā)此事件。
dragend	None	當(dāng)用戶停止拖動(dòng)地圖時(shí)會(huì)觸發(fā)此事件。
dragstart	None	當(dāng)用戶開始拖動(dòng)地圖時(shí)會(huì)觸發(fā)此事件。
heading_changed	None	當(dāng)?shù)貓D heading（方向）屬性更改時(shí)會(huì)觸發(fā)此事件。
idle	None	當(dāng)?shù)貓D在平移或縮放之后變?yōu)殚e置狀態(tài)時(shí)會(huì)觸發(fā)此事件。
maptypeid_changed	None	當(dāng) mapTypeId 屬性更改時(shí)會(huì)觸發(fā)此事件。
mousemove	MouseEvent	只要用戶的鼠標(biāo)在地圖容器上移動(dòng)，就會(huì)觸發(fā)此事件。
mouseout	MouseEvent	當(dāng)用戶的鼠標(biāo)從地圖容器上退出時(shí)會(huì)觸發(fā)此事件。
mouseover	MouseEvent	當(dāng)用戶的鼠標(biāo)進(jìn)入地圖容器時(shí)會(huì)觸發(fā)此事件。
projection_changed	None	當(dāng)投影更改時(shí)會(huì)觸發(fā)此事件。
resize	None	當(dāng)?shù)貓D（div）更改尺寸時(shí)會(huì)觸發(fā)此事件。
rightclick	MouseEvent	當(dāng)用戶右擊地圖時(shí)會(huì)觸發(fā)此事件。
tilesloaded	None	當(dāng)可見圖塊載入完成后會(huì)觸發(fā)此事件。
tilt_changed	None	當(dāng)?shù)貓D tilt（傾斜）屬性更改時(shí)會(huì)觸發(fā)此事件。
zoom_changed	None	當(dāng)?shù)貓D zoom（縮放）屬性更改時(shí)會(huì)觸發(fā)此事件。