---
title: Map
framework: mapkitjs
role: symbol
role_heading: Class
path: mapkitjs/map
---

# Map

An embeddable interactive map that you add to a webpage.

## Declaration

```data
class Map extends EventTarget
```

## Mentioned in

Loading the latest version of MapKit JS Adding interactivity to overlays Migrating from Version 5 to Version 6

## Overview

Overview A map is a self-contained view object that you embed on a webpage. It’s possible to have multiple independent maps on a single webpage, although typically webpages only need one interactive map.

## Topics

### Creating a map

- [new Map(parent, options)](mapkitjs/map/mapconstructor.md)
- [MapConstructorOptions](mapkitjs/mapconstructoroptions.md)

### Handling map events

- [Handling map events](mapkitjs/handling-map-events.md)

### Accessing interaction properties

- [isRotationAvailable](mapkitjs/map/isrotationavailable.md)
- [isRotationEnabled](mapkitjs/map/isrotationenabled.md)
- [isScrollEnabled](mapkitjs/map/isscrollenabled.md)
- [isZoomEnabled](mapkitjs/map/iszoomenabled.md)

### Manipulating the visible portion of the map

- [center](mapkitjs/map/center.md)
- [setCenterAnimated(coordinate, animated)](mapkitjs/map/setcenteranimated.md)
- [region](mapkitjs/map/region.md)
- [setRegionAnimated(region, animated)](mapkitjs/map/setregionanimated.md)
- [rotation](mapkitjs/map/rotation.md)
- [setRotationAnimated(degrees, animated)](mapkitjs/map/setrotationanimated.md)
- [visibleMapRect](mapkitjs/map/visiblemaprect.md)
- [setVisibleMapRectAnimated(mapRect, animated)](mapkitjs/map/setvisiblemaprectanimated.md)
- [cameraBoundary](mapkitjs/map/cameraboundary.md)
- [setCameraBoundaryAnimated(cameraBoundary, animated)](mapkitjs/map/setcameraboundaryanimated.md)
- [CameraBoundaryDescription](mapkitjs/cameraboundarydescription.md)
- [cameraDistance](mapkitjs/map/cameradistance.md)
- [setCameraDistanceAnimated(distance, animated)](mapkitjs/map/setcameradistanceanimated.md)
- [cameraZoomRange](mapkitjs/map/camerazoomrange.md)
- [setCameraZoomRangeAnimated(cameraZoomRange, animated)](mapkitjs/map/setcamerazoomrangeanimated.md)

### Showing the map’s controls

- [showsCompass](mapkitjs/map/showscompass.md)
- [showsMapTypeControl](mapkitjs/map/showsmaptypecontrol.md)
- [showsScale](mapkitjs/map/showsscale.md)
- [showsUserLocationControl](mapkitjs/map/showsuserlocationcontrol.md)
- [showsZoomControl](mapkitjs/map/showszoomcontrol.md)

### Configuring the map’s appearance

- [colorScheme](mapkitjs/map/colorscheme.md)
- [distances](mapkitjs/map/distances-data.property.md)
- [mapType](mapkitjs/map/maptype.md)
- [padding](mapkitjs/map/padding.md)
- [pointOfInterestFilter](mapkitjs/map/pointofinterestfilter.md)
- [showsPointsOfInterest](mapkitjs/map/showspointsofinterest.md)
- [showItems(items, options)](mapkitjs/map/showitems.md)
- [MapShowItemsOptions](mapkitjs/mapshowitemsoptions.md)
- [tintColor](mapkitjs/map/tintcolor.md)

### Annotating the map

- [annotations](mapkitjs/map/annotations.md)
- [selectedAnnotation](mapkitjs/map/selectedannotation.md)
- [annotationForCluster](mapkitjs/map/annotationforcluster.md)
- [annotationsInMapRect(mapRect)](mapkitjs/map/annotationsinmaprect.md)
- [addAnnotation(annotation)](mapkitjs/map/addannotation.md)
- [addAnnotations(annotations)](mapkitjs/map/addannotations.md)
- [removeAnnotation(annotation)](mapkitjs/map/removeannotation.md)
- [removeAnnotations(annotations)](mapkitjs/map/removeannotations.md)

### Adding and removing overlays

- [overlays](mapkitjs/map/overlays.md)
- [selectedOverlay](mapkitjs/map/selectedoverlay.md)
- [overlaysAtPoint(point)](mapkitjs/map/overlaysatpoint.md)
- [addOverlay(overlay)](mapkitjs/map/addoverlay.md)
- [addOverlays(overlays)](mapkitjs/map/addoverlays.md)
- [removeOverlay(overlay)](mapkitjs/map/removeoverlay.md)
- [removeOverlays(overlays)](mapkitjs/map/removeoverlays.md)
- [topOverlayAtPoint(point)](mapkitjs/map/topoverlayatpoint.md)

### Adding and removing geographical features

- [addItems(items)](mapkitjs/map/additems.md)
- [removeItems(items)](mapkitjs/map/removeitems.md)

### Adding and removing tile overlays

- [tileOverlays](mapkitjs/map/tileoverlays.md)
- [addTileOverlay(tileOverlay)](mapkitjs/map/addtileoverlay.md)
- [addTileOverlays(tileOverlays)](mapkitjs/map/addtileoverlays.md)
- [removeTileOverlay(tileOverlay)](mapkitjs/map/removetileoverlay.md)
- [removeTileOverlays(tileOverlays)](mapkitjs/map/removetileoverlays.md)

### Exploring at street level

- [LookAround](mapkitjs/lookaround.md)
- [LookAroundOptions](mapkitjs/lookaroundoptions.md)
- [LookAroundPreview](mapkitjs/lookaroundpreview.md)
- [LookAroundPreviewOptions](mapkitjs/lookaroundpreviewoptions.md)
- [LookAroundScene](mapkitjs/lookaroundscene.md)
- [CommonLookAroundOptions](mapkitjs/commonlookaroundoptions.md)

### Displaying the user’s location

- [showsUserLocation](mapkitjs/map/showsuserlocation.md)
- [tracksUserLocation](mapkitjs/map/tracksuserlocation.md)
- [userLocationAnnotation](mapkitjs/map/userlocationannotation.md)

### Converting map coordinates

- [convertCoordinateToPointOnPage(coordinate)](mapkitjs/map/convertcoordinatetopointonpage.md)
- [convertPointOnPageToCoordinate(point)](mapkitjs/map/convertpointonpagetocoordinate.md)

### Destroying a map

- [destroy()](mapkitjs/map/destroy.md)

### Accessing the element

- [element](mapkitjs/map/element.md)

### Selecting map features

- [selectableMapFeatures](mapkitjs/map/selectablemapfeatures.md)
- [selectableMapFeatureSelectionAccessory](mapkitjs/map/selectablemapfeatureselectionaccessory.md)
- [annotationForMapFeature](mapkitjs/map/annotationformapfeature.md)

### Prioritizing feature loading

- [loadPriority](mapkitjs/map/loadpriority.md)

### Deprecated

- [ColorSchemes](mapkitjs/map/colorschemes.md)
- [Distances](mapkitjs/map/distances-data.var.md)
- [LoadPriorities](mapkitjs/map/loadpriorities.md)
- [MapTypes](mapkitjs/map/maptypes.md)

## Relationships

### Inherits From

- EventTarget

## See Also

### Maps

- [maps](mapkitjs/mapkit/maps.md)