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

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

本文主要介紹Google 地圖API Map(),這里對Map()構造器的知識做了一下整理以及提供簡單的代碼示例,開發(fā)Google 地圖應用的朋友可以參考下

地圖 API Map() 構造器

實例

創(chuàng)建一個 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() 構造器創(chuàng)建了一個新的地圖并插入到指定的HTML元素中（<div> 元素)。

語法

new google.maps.Map(HTMLElement,MapOptions)

參數(shù)值

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

Map()的方法

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

Map()的屬性

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

Map()的事件

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