---
title: LookAround
framework: mapkitjs
role: symbol
role_heading: Class
path: mapkitjs/lookaround
---

# LookAround

A view that allows someone to see a street level view of a place.

## Declaration

```data
class LookAround extends AbstractLookAround
```

## Mentioned in

Loading the latest version of MapKit JS MapKit JS 5

## Discussion

Discussion note: The full bundle of MapKit JS doesn’t implement this class. Use a Look Around view to create street-level imagery for a specific geographic location on the map. You can, optionally, allow someone to navigate inside this view so they can explore the place at street level or zoom the view for a larger-screen experience. note: Not all places support Look Around. The following example contains the two elements needed to display a Look Around View on a web page:

The HTML code below implements a web page that renders a container which has a label that provides a description of the place the Look Around view displays. <script   src="https://cdn.apple-mapkit.com/mk/x/mapkit.core.js"   crossorigin async   data-callback="initMapKit"   data-token="YOUR TOKEN HERE"   data-libraries="look-around,services"></script> <style> #container { width: 735px; height: 552px } </style>

<div id="container"></div> The JavaScript listing below implements a MapKitJS Look Around object that the web page displays inside the <div id="container"> element of the page. The Look Around view shows a navigable view of Cherry Hill Fountain in Central Park in New York City that Look Around renders using a PlaceID. For more information on obtaining a PlaceID for a specific location. For more information on Place IDs, see Identifying unique locations with Place IDs. async function initializeMapKitJS() {   if (!window.mapkit || window.mapkit.loadedLibraries.length === 0) {     await new Promise(res => window.initMapKit = res)     delete window.initMapKit   } }

(async () => {   await initializeMapKitJS();   // Look Around view code

const placeLookup = new mapkit.PlaceLookup();   const place = await new Promise(       resolve => placeLookup.getPlace(           // The PlaceID that represents Cherry Hill Fountain, Central Park, New York, NY           "IEA18943388D2216C",           (error, result) => resolve(result)       )   );

// Create an interactive Look Around view.   const lookAround = new mapkit.LookAround(       document.getElementById("container"),       place,       {           // Allow users to expand the view.           showsDialogControl: true       }   );

})() Handling Look Around loading states Look Around view dispatches the following events: load: A DOM Event. The Look Around view loaded. error: A LookAroundErrorEvent. The Look Around view encountered an error, for example, in an unsupported browser, or a location with no Look Around imagery. readystatechange: A DOM Event. The ready state changed. open-dialog:  A DOM Event. The Look Around view is about to expand. leave-dialog:  A DOM Event. The Look Around view is about to contract. close:  A DOM Event. Someone has interacted with the close control.

## Topics

### Creating a Look Around view

- [new LookAround(parent, location, options)](mapkitjs/lookaround/lookaroundconstructor.md)

### Controlling the interactions with a Look Around view

- [isNavigationEnabled](mapkitjs/abstractlookaround/isnavigationenabled.md)
- [isScrollEnabled](mapkitjs/abstractlookaround/isscrollenabled.md)
- [isZoomEnabled](mapkitjs/abstractlookaround/iszoomenabled.md)

### Controlling additional information the Look Around view displays

- [showsPointsOfInterest](mapkitjs/abstractlookaround/showspointsofinterest.md)
- [showsRoadLabels](mapkitjs/abstractlookaround/showsroadlabels.md)

### Controlling the Look Around dialog

- [openDialog](mapkitjs/abstractlookaround/opendialog.md)

### Controlling the display of window controls

- [showsCloseControl](mapkitjs/lookaround/showsclosecontrol.md)
- [showsDialogControl](mapkitjs/lookaround/showsdialogcontrol.md)

### Getting information about the Look Around object and its state

- [element](mapkitjs/abstractlookaround/element.md)
- [scene](mapkitjs/abstractlookaround/scene.md)
- [padding](mapkitjs/abstractlookaround/padding.md)
- [readyState](mapkitjs/abstractlookaround/readystate.md)
- [LookAroundReadyState](mapkitjs/lookaroundreadystate.md)

### Closing and releasing a Look Around view

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

### Events and event properties

- [LookAroundErrorEvent](mapkitjs/lookarounderrorevent.md)
- [LookAroundErrorType](mapkitjs/lookarounderrortype.md)

### Static properties

- [ReadyStates](mapkitjs/lookaround/readystates.md)

## Relationships

### Inherits From

- [AbstractLookAround](mapkitjs/abstractlookaround.md)

## See Also

### Exploring at street level

- [LookAroundOptions](mapkitjs/lookaroundoptions.md)
- [LookAroundPreview](mapkitjs/lookaroundpreview.md)
- [LookAroundPreviewOptions](mapkitjs/lookaroundpreviewoptions.md)
- [LookAroundScene](mapkitjs/lookaroundscene.md)
- [CommonLookAroundOptions](mapkitjs/commonlookaroundoptions.md)
- [AbstractLookAround](mapkitjs/abstractlookaround.md)
- [lookAroundViews](mapkitjs/mapkit/lookaroundviews.md)