<iframe src="https://developers.devsite.google/frame/maps/documentation/javascript/reference/image-overlay_012c474d933ec9c62b90a90b1defc8252dfca43490e74f335bc92f0a1c450175.frame" class="framebox inherit-locale redirect-iframe" allow="clipboard-write https://developers.devsite.google" allowfullscreen is-upgraded></iframe>

## [MapType](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#MapType)
interface


interface
`google.maps.MapType`

implemented by `ImageMapType, StyledMapType`

This interface defines the map type, and is typically used for custom map types. Immutable.

| ### Properties ||
|---|---|
| `maxZoom` | **Type:** `number` The maximum zoom level for the map when displaying this MapType. Required for base MapTypes, ignored for overlay MapTypes. |
| `minZoom` | **Type:** `number` The minimum zoom level for the map when displaying this MapType. Optional; defaults to 0. |
| `radius` | **Type:** `number` Radius of the planet for the map, in meters. Optional; defaults to Earth's equatorial radius of 6378137 meters. |
| `alt` optional | **Type:** `string optional` Alt text to display when this MapType's button is hovered over in the MapTypeControl. Optional. |
| `name` optional | **Type:** `string optional` Name to display in the MapTypeControl. Optional. |
| `projection` optional | **Type:** `Projection optional` The Projection used to render this MapType. Optional; defaults to Mercator. |
| `tileSize` optional | **Type:** `Size optional` The dimensions of each tile. Required. |

| ### Methods ||
|---|---|
| `getTile` | `getTile(tileCoord, zoom, ownerDocument)` **Parameters:** - `tileCoord: Point` Tile coordinates. - `zoom: number` Tile zoom. - `ownerDocument: Document` The document which owns this tile. **Return Value:** `Element|null` Resulting tile. Returns a tile for the given tile coordinate (x, y) and zoom level. This tile will be appended to the given ownerDocument. Not available for base map types. |
| `releaseTile` | `releaseTile(tile)` **Parameters:** - `tile: Element optional` Tile to release. **Return Value:** `void` Releases the given tile, performing any necessary cleanup. The provided tile will have already been removed from the document. Optional. |

## [Projection](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#Projection)
interface


interface
`google.maps.Projection`

Projection interface.

| ### Methods ||
|---|---|
| `fromLatLngToPoint` | `fromLatLngToPoint(latLng[, point])` **Parameters:** - `latLng: LatLng|LatLngLiteral` - `point: Point optional` **Return Value:** `Point|null` Translates from the LatLng cylinder to the Point plane. This interface specifies a function which implements translation from given `LatLng` values to world coordinates on the map projection. The Maps API calls this method when it needs to plot locations on screen. `Projection` objects must implement this method, but may return `null` if the projection cannot calculate the `Point`. |
| `fromPointToLatLng` | `fromPointToLatLng(pixel[, noClampNoWrap])` **Parameters:** - `pixel: Point` - `noClampNoWrap: boolean optional` **Return Value:** `LatLng|null` This interface specifies a function which implements translation from world coordinates on a map projection to `LatLng` values. The Maps API calls this method when it needs to translate actions on screen to positions on the map. `Projection` objects must implement this method, but may return `null` if the projection cannot calculate the `LatLng`. |

## [ImageMapType](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#ImageMapType)
class


class
`google.maps.ImageMapType`
extends `MVCObject`
implements `MapType`

library `"maps"`

This class implements the MapType interface and is provided for rendering image tiles.

```javascript
const {ImageMapType} = await google.maps.importLibrary("maps");
```

| ### Constructor ||
|---|---|
| `ImageMapType` | `ImageMapType(opts)` **Parameters:** - `opts: ImageMapTypeOptions optional` Constructs an ImageMapType using the provided ImageMapTypeOptions |

| ### Properties ||
|---|---|
| `alt` | **Type:** `string optional` |
| `maxZoom` | **Type:** `number` |
| `minZoom` | **Type:** `number` |
| `name` | **Type:** `string optional` |
| `projection` | **Type:** `Projection optional` |
| `radius` | **Type:** `number` |
| `tileSize` | **Type:** `Size optional` |

| ### Methods ||
|---|---|
| `getOpacity` | `getOpacity()` **Parameters:** None **Return Value:** `number` opacity The current opacity. Returns the opacity level (`0` (transparent) to `1.0`) of the `ImageMapType` tiles. |
| `getTile` | `getTile(tileCoord, zoom, ownerDocument)` **Parameters:** - `tileCoord: Point optional` Tile coordinates. - `zoom: number` Tile zoom. - `ownerDocument: Document optional` The document which owns this tile. **Return Value:** `Element|null` Resulting tile. |
| `releaseTile` | `releaseTile(tileDiv)` **Parameters:** - `tileDiv: Element optional` Tile to release. **Return Value:** None |
| `setOpacity` | `setOpacity(opacity)` **Parameters:** - `opacity: number` The new opacity. **Return Value:** None Sets the opacity level (`0` (transparent) to `1.0`) of the `ImageMapType` tiles. |

| ### Events ||
|---|---|
| `tilesloaded` | `function()` **Arguments:** None This event is fired when the visible tiles have finished loading. |

## [ImageMapTypeOptions](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#ImageMapTypeOptions)
interface


interface
`google.maps.ImageMapTypeOptions`

This class is used to create a MapType that renders image tiles.

| ### Properties ||
|---|---|
| `alt` optional | **Type:** `string optional` Alt text to display when this MapType's button is hovered over in the MapTypeControl. |
| `getTileUrl` optional | **Type:** `function(Point, number): (string optional) optional` Returns a string (URL) for given tile coordinate (x, y) and zoom level. |
| `maxZoom` optional | **Type:** `number optional` The maximum zoom level for the map when displaying this MapType. |
| `minZoom` optional | **Type:** `number optional` The minimum zoom level for the map when displaying this MapType. Optional. |
| `name` optional | **Type:** `string optional` Name to display in the MapTypeControl. |
| `opacity` optional | **Type:** `number optional` The opacity to apply to the tiles. The opacity should be specified as a float value between 0 and 1.0, where 0 is fully transparent and 1 is fully opaque. |
| `tileSize` optional | **Type:** `Size optional` The tile size. |

## [GroundOverlay](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#GroundOverlay)
class


class
`google.maps.GroundOverlay`
extends `MVCObject`

library `"maps"`

A rectangular image overlay on the map.

```javascript
const {GroundOverlay} = await google.maps.importLibrary("maps");
```

| ### Constructor ||
|---|---|
| `GroundOverlay` | `GroundOverlay(url, bounds[, opts])` **Parameters:** - `url: string` - `bounds: LatLngBounds|LatLngBoundsLiteral optional` - `opts: GroundOverlayOptions optional` Creates a ground overlay from the provided image URL and its `LatLngBounds`. The image is scaled to fit the current bounds, and projected using the current map projection. |

| ### Methods ||
|---|---|
| `getBounds` | `getBounds()` **Parameters:** None **Return Value:** `LatLngBounds|null` Gets the `LatLngBounds` of this overlay. |
| `getMap` | `getMap()` **Parameters:** None **Return Value:** `Map|null` Returns the map on which this ground overlay is displayed. |
| `getOpacity` | `getOpacity()` **Parameters:** None **Return Value:** `number` Returns the opacity of this ground overlay. |
| `getUrl` | `getUrl()` **Parameters:** None **Return Value:** `string` Gets the url of the projected image. |
| `setMap` | `setMap(map)` **Parameters:** - `map: Map optional` **Return Value:** `void` Renders the ground overlay on the specified map. If map is set to `null`, the overlay is removed. |
| `setOpacity` | `setOpacity(opacity)` **Parameters:** - `opacity: number` **Return Value:** `void` Sets the opacity of this ground overlay. |

| ### Events ||
|---|---|
| `click` | `function(event)` **Arguments:** - `event: MapMouseEvent optional` This event is fired when the DOM click event is fired on the `GroundOverlay`. |
| `dblclick` | `function(event)` **Arguments:** - `event: MapMouseEvent optional` This event is fired when the DOM dblclick event is fired on the `GroundOverlay`. |

## [GroundOverlayOptions](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#GroundOverlayOptions)
interface


interface
`google.maps.GroundOverlayOptions`

This object defines the properties that can be set on a `GroundOverlay` object.

| ### Properties ||
|---|---|
| `clickable` optional | **Type:** `boolean optional` If `true`, the ground overlay can receive mouse events. |
| `map` optional | **Type:** `Map optional` The map on which to display the overlay. |
| `opacity` optional | **Type:** `number optional` **Default:** `1.0` The opacity of the overlay, expressed as a number between 0 and 1. Optional. |

## [StyledMapType](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#StyledMapType)
class


class
`google.maps.StyledMapType`
extends `MVCObject`
implements `MapType`

library `"maps"`

Creates a `MapType` with a custom style.

```javascript
const {StyledMapType} = await google.maps.importLibrary("maps");
```

| ### Constructor ||
|---|---|
| `StyledMapType` | `StyledMapType(styles[, options])` **Parameters:** - `styles: Array<MapTypeStyle optional> optional` The styles to apply. - `options: StyledMapTypeOptions optional` The styled map type options. Creates a styled `MapType` with the specified options. The `StyledMapType` takes an array of `MapTypeStyle`s, where each `MapTypeStyle` is applied to the map consecutively. A later `MapTypeStyle` that applies the same `MapTypeStyler`s to the same selectors as an earlier `MapTypeStyle` will override the earlier `MapTypeStyle`. Note that the `StyledMapType` is not supported when a map ID is set. When using both together, you will receive a console warning. |

| ### Properties ||
|---|---|
| `alt` | **Type:** `string` |
| `maxZoom` | **Type:** `number` |
| `minZoom` | **Type:** `number` |
| `name` | **Type:** `string` |
| `projection` | **Type:** `Projection optional` |
| `radius` | **Type:** `number` |
| `tileSize` | **Type:** `Size optional` |

| ### Methods ||
|---|---|
| `getTile` | `getTile(tileCoord, zoom, ownerDocument)` **Parameters:** - `tileCoord: Point optional` Tile coordinates. - `zoom: number` Tile zoom. - `ownerDocument: Document optional` The document which owns this tile. **Return Value:** `Element|null` Resulting tile. |
| `releaseTile` | `releaseTile(tile)` **Parameters:** - `tile: Element optional` Tile to release. **Return Value:** `void` |

## [StyledMapTypeOptions](https://developers.google.com/maps/documentation/javascript/reference/image-overlay.md.txt#StyledMapTypeOptions)
interface


interface
`google.maps.StyledMapTypeOptions`

This class is used to specify options when creating a `StyledMapType`. These options cannot be changed after the `StyledMapType` is instantiated.

| ### Properties ||
|---|---|
| `alt` optional | **Type:** `string optional` Text to display when this `MapType`'s button is hovered over in the map type control. |
| `maxZoom` optional | **Type:** `number optional` The maximum zoom level for the map when displaying this `MapType`. Optional. |
| `minZoom` optional | **Type:** `number optional` The minimum zoom level for the map when displaying this `MapType`. Optional. |
| `name` optional | **Type:** `string optional` The name to display in the map type control. |