Maps API Map() Constructor

## Google Maps API

Maps API Home Maps API Key Maps Basic Maps Overlays Maps Events Maps Controls Maps Types

## Google Maps Ref

Maps API Reference Map()

# Maps API Map() Constructor

« Previous
Next Chapter »

## Example

Create a Google Map:

var map=new google.maps.Map(document.getElementById("googleMap"),mapOpt);
Try it yourself »

## Definition and Usage

The Map() constructor creates a new map inside a specified HTML element (typically a <div> element).

## Syntax

new google.maps.Map(HTMLElement,MapOptions)

## Parameter Values

Parameter | Description
--- | ---
HTMLElement | Specifies in what HTML element to put the map
MapOptions | A MapOptions object that holds the map initialization variables/options

## Methods of Map()

Method | Return Value | Description
--- | --- | ---
fitBounds(LatLngBounds) | None | Sets the viewport to contain the given bounds
getBounds() | LatLng,LatLng | Returns the south-west latitude/longitude and the north-east latitude/longitude of the current viewport
getCenter() | LatLng | Returns the lat/lng of the center of the map
getDiv() | Node | Returns a DOM object that contains the map
getHeading() | number | Returns the compass heading of aerial imagery (for SATELLITE and HYBRID map types)
getMapTypeId() | HYBRID ROADMAP SATELLITE TERRAIN | Returns the current map type
getProjection() | Projection | Returns the current Projection
getStreetView() | StreetViewPanorama | Returns the default StreetViewPanorama bound to the map
getTilt() | number | Returns the angle of incidence for aerial imagery in degrees (for SATELLITE and HYBRID map types)
getZoom() | number | Returns the current zoom level of the map
panBy(xnumber,ynumber) | None | Changes the center of the map by the given distance in pixels
panTo(LatLng) | None | Changes the center of the map to the given LatLng
panToBounds(LatLngBounds) | None | Pans the map by the minimum amount necessary to contain the given LatLngBounds
setCenter(LatLng) | None |
setHeading(number) | None | Sets the compass heading for aerial imagery measured in degrees from cardinal direction North
setMapTypeId(MapTypeId) | None | Changes the kind of map to display
setOptions(MapOptions) | None |
setStreetView(StreetViewPanorama) | None | Binds a StreetViewPanorama to the map
setTilt(number) | None | Sets the angle of incidence for aerial imagery in degrees (for SATELLITE and HYBRID map types)
setZoom(number) | None |

## Properties of Map()

Property | Type | Description
--- | --- | ---
controls | Array.<MVCArray.<Node>> | Additional controls to attach to the map
mapTypes | MapTypeRegistry | A registry of MapType instances by string ID
overlayMapTypes | MVCArray.<MapType> | Additional map types to overlay

## Events of Map()

Event | Arguments | Description
--- | --- | ---
bounds_changed | None | Fired when the viewport bounds have changed
center_changed | None | Fired when the map center property changes
click | MouseEvent | Fired when the user clicks on the map
dblclick | MouseEvent | Fired when the user double-clicks on the map
drag | None | Fired repeatedly while the user drags the map
dragend | None | Fired when the user stops dragging the map
dragstart | None | Fired when the user starts dragging the map
heading_changed | None | Fired when the map heading property changes
idle | None | Fired when the map becomes idle after panning or zooming
maptypeid_changed | None | Fired when the mapTypeId property changes
mousemove | MouseEvent | Fired whenever the user's mouse moves over the map container
mouseout | MouseEvent | Fired when the user's mouse exits the map container
mouseover | MouseEvent | Fired when the user's mouse enters the map container
projection_changed | None | Fired when the projection has changed
resize | None | Fired when the map (div) changes size
rightclick | MouseEvent | Fired when the user right-clicks on the map
tilesloaded | None | Fired when the visible tiles have finished loading
tilt_changed | None | Fired when the map tilt property changes
zoom_changed | None | Fired when the map zoom property changes

« Previous
Next Chapter »

## Your suggestion:

Your E-mail (optional):

Page address:

Description:

Close [X]

## Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

## WEB HOSTING

Best Web Hosting UK Reseller Hosting Wow! $5 SSD Hosting

## WEB BUILDING

Download XML Editor
FREE Website BUILDER FREE Website Creator

## WEB RESOURCES

Web Statistics Web Validation

## SHARE THIS PAGE