# How to display a map
Amazon Location Service allows you to display both interactive and non-interactive maps using our map styles. See [AWS map styles and features](map-styles.md) to learn more.
## Interactive map
In this example, you will display an interactive map that allows users to zoom, pan, pinch, and pitch.
### Interactive map code example
------
#### [ index.html ]
```
Display a map
```
------
#### [ style.css ]
```
body { margin: 0; padding: 0; }
html, body, #map { height: 100%; }
```
------
## Restrict map panning beyond an area
In this example, you will restrict the map from being panned beyond a defined boundary.
### Restrict map panning code example
------
#### [ index.html ]
```
Display a map
```
------
#### [ style.css ]
```
body { margin: 0; padding: 0; }
html, body, #map { height: 100%; }
```
------
## Non-interactive map
In this example, you will display a non-interactive map by disabling user interaction.
### Non-interactive map code example
------
#### [ index.html ]
```
Display a map
```
------
#### [ style.css ]
```
body { margin: 0; padding: 0; }
html, body, #map { height: 100%; }
```
------