X
HOME HTML CSS JAVASCRIPT SQL PHP JQUERY ANGULAR BOOTSTRAP XML ASP.NET MORE...
REFERENCES | EXAMPLES | FORUM | ABOUT

Maps API Map() Constructor


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


Your suggestion:

Close [X]

Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

WEB HOSTING

UK Reseller Hosting

WEB BUILDING

Download XML Editor FREE Website BUILDER Free HTML5 Templates

SHARE THIS PAGE

facebook