Reference Manual for Google Maps

Map() Constructor

Create Google Maps:

var map = new google.maps.Map(mapCanvas, mapOptions);

Definition and Usage

The Map() constructor creates a new map within the specified HTML element (usually a <div> element).

Syntax

new google.maps.Map(HTMLElement,MapOptions)

Parameter value

Parameters Description
HTMLElement Specify which HTML element the map will be placed in.
MapOptions Save the MapOptions object containing the initialized variables/options of Map().

Methods of Map()

Method Return value Description
fitBounds(LatLngBounds) None Set the viewport to contain the given boundary.
getBounds() LatLng,LatLng Return the southwest and northeast latitude/longitude of the current viewport.
getCenter() LatLng Return the latitude and longitude of the map center.
getDiv() Node Return the DOM object containing the map.
getHeading() number

Return the compass heading of the aerial image.

Applicable to SATELLITE and HYBRID map types.
getMapTypeId()
  • HYBRID
  • ROADMAP
  • SATELLITE
  • TERRAIN
 Return the current map type.
getProjection() Projection Return the current projection.
getStreetView() StreetViewPanorama Return the default StreetViewPanorama bound to the map.
getTilt() number

Return the incidence angle of the aerial image (in degrees).

Applicable to SATELLITE and HYBRID map types.
getZoom() number Return the current zoom level of the map.
panBy(xnumber,ynumber) None Change the map center by a given distance (in pixels).
panTo(LatLng) None Change the map center to the given LatLng.
panToBounds(LatLngBounds) None Pan the map by the minimum amount required to contain the given LatLngBounds.
setCenter(LatLng) None Set the latitude and longitude of the map center.
setHeading(number) None

Set the compass heading of the aerial image.

In degrees measured from the cardinal direction of north.
setMapTypeId(MapTypeId) None Set the map type to be displayed.
setOptions(MapOptions) None
setStreetView(StreetViewPanorama) None Bind StreetViewPanorama to the map.
setTilt(number) None

Set the incidence angle of the aerial image (in degrees).

Applicable to SATELLITE and HYBRID map types.
setZoom(number) None Set the zoom level of the map.

Properties of Map()

Property Type Description
controls Array.<MVCArray.<Node>> Additional controls appended to the map.
mapTypes MapTypeRegistry Registry of MapType instances by string ID.
overlayMapTypes MVCArray.<MapType> Other map types to overlay.

Events of Map()

Event Parameters Description
bounds_changed None Triggered when the viewport boundary changes.
center_changed None Triggered when the map center attribute changes.
click MouseEvent Triggered when the user clicks on the map.
dblclick MouseEvent Triggered when the user double-clicks on the map.
drag None Triggered repeatedly when the user drags the map.
dragend None Triggered when the user stops dragging the map.
dragstart None Triggered when the user starts dragging the map.
heading_changed None Triggered when the map title attribute changes.
idle None Triggered when the map becomes idle after panning or zooming.
maptypeid_changed None Triggered when the mapTypeId attribute changes.
mousemove MouseEvent Triggered whenever the user's mouse moves over the map container.
mouseout MouseEvent Triggered when the user's mouse exits the map container.
mouseover MouseEvent Triggered when the user's mouse enters the map container.
projection_changed None Triggered when the projection changes.
resize None Triggered when the size of the map (div) changes.
rightclick MouseEvent Triggered when the user right-clicks on the map.
tilesloaded None Triggered when the visible tiles are loaded.
tilt_changed None Triggered when the map tilt attribute changes.
zoom_changed None Triggered when the map zoom attribute changes.

Overlay layer

Constructor/Object Description
Marker Create a marker. (Note that the display position of the marker must be set correctly)
MarkerOptions Options for rendering the marker.
MarkerImage Represents the structure of the marker icon or shadow image.
MarkerShape The marker shape used to define the clickable area (type and coordinates) of the marker.
Animation Specifies the animation that can be played on the marker (bounce or drop).
InfoWindow Create an info window.
InfoWindowOptions Options for rendering info windows.
Polyline Create a polyline (including path and stroke style).
PolylineOptions Options for rendering polylines.
Polygon Create a polygon (including path and stroke + fill style).
PolygonOptions Options for rendering polygons.
Rectangle Create a rectangle (including boundaries and stroke + fill style).
RectangleOptions Options for rendering rectangles.
Circle Create a circle (including center + radius and stroke + fill style).
CircleOptions Options for rendering circles.
GroundOverlay
GroundOverlayOptions
OverlayView
MapPanes
MapCanvasProjection

Event

Constructor/Object Description
MapsEventListener

It has no methods or constructor.

Its instance is returned from addListener(), addDomListener(), and finally passed back to removeListener().
event Add/remove/trigger event listeners.
MouseEvent Returns various mouse events from the map and overlay layers.

Control

Control/Object Description
MapTypeControlOptions Save options used to modify controls (position and style).
MapTypeControlStyle Specifies the type of map control to display (drop-down menu or button).
OverviewMapControlOptions Used for rendering overview map control options (expanded or collapsed).
PanControlOptions Used for rendering pan control options (position).
RotateControlOptions Used for rendering rotate control options (position).
ScaleControlOptions Used for rendering scale control options (position and style).
ScaleControlStyle Specifies which scale control to display.
StreetViewControlOptions Used for rendering street view pegman control options (position).
ZoomControlOptions Used for rendering zoom control options (position and style).
ZoomControlStyle Specify which zoom control (large or small) to display.
ControlPosition Specify the position of the control on the map.