element).
* * *
## Syntax
new google.maps.Map(_HTMLElement_,_MapOptions_)
## Parameter Values
| Parameter | Description |
| --- | --- |
| _HTMLElement_ | Specifies which HTML element to place the map in. |
| _(#)_ | A MapOptions object containing map initialization variables/options. |
* * *
## Map() Methods
| Method | Return Value | Description |
| --- | --- | --- |
| fitBounds(_LatLngBounds_) | None | Sets the viewport to contain the given bounds. |
| [getBounds()](#) | _LatLng,LatLng_ | Returns the southwest and northeast latitude/longitude of the current viewport. |
| [getCenter()](#) | _LatLng_ | Returns the latitude/longitude of the map's center. |
| [getDiv()](#) | _Node_ | Returns the DOM object containing 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 incidence angle of 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 the minimum distance to contain the given LatLngBounds. |
| setCenter(_LatLng_) | None | |
| setHeading(_number_) | None | Sets the compass heading for aerial imagery (measured in degrees with north as 0). |
| [setMapTypeId(_MapTypeId_)](#) | None | Changes the map type to display. |
| setOptions(_MapOptions_) | None | |
| setStreetView(_StreetViewPanorama_) | None | Binds a StreetViewPanorama to the map. |
| setTilt(_number_) | None | Sets the incidence angle of aerial imagery in degrees (for SATELLITE and HYBRID map types). |
| setZoom(_number_) | None | |
## Map() Properties
| Property | Type | Description |
| --- | --- | --- |
| controls | _Array.<MVCArray.>_ | Additional controls to attach to the map. |
| mapTypes | _MapTypeRegistry_ | Registry of MapType instances by string ID. |
| overlayMapTypes | _MVCArray._ | Additional map types to overlay. |
## Map() Events
| Event | Parameters | Description |
| --- | --- | --- |
| bounds_changed | None | Triggered when the viewport bounds change. |
| center_changed | None | Triggered when the map's center property changes. |
| click | _MouseEvent_ | Triggered when the user clicks on the map (but not on markers or info windows). |
| dblclick | _MouseEvent_ | Triggered when the user double-clicks the map. Note that a click event will fire first. |
| drag | None | Triggered repeatedly while 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's heading property changes. |
| idle | None | Triggered when the map becomes idle after panning or zooming. |
| maptypeid_changed | None | Triggered when the mapTypeId property 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 map's (div) dimensions change. |
| rightclick | _MouseEvent_ | Triggered when the user right-clicks the map. |
| tilesloaded | None | Triggered when visible tiles finish loading. |
| tilt_changed | None | Triggered when the map's tilt property changes. |
| zoom_changed | None | Triggered when the map's zoom property changes. |
Ref Map
Here's the translated HTML content with all code blocks and HTML tags preserved:
## Example
Create a Google Map:
var map=new google.maps.Map(document.getElementById("googleMap"),mapOpt);
[Try it Β»](#)
* * *
## Definition and Usage
The Map() constructor creates a new map and inserts it into the specified HTML element (
YouTip