

# Dynamic maps
<a name="dynamic-maps"></a>

**Note**  
You must use the political view feature to comply with applicable laws, including those related to mapping the country or region where maps, images, and other data you access through Amazon Location Service are made available.

Dynamic maps, also known as interactive maps, are digital maps that support gestures such as zoom, pan, ease, fly, pitch, rotate, and bearing. With Amazon Location Service, you can build map applications that provide responsive, interactive, and immersive experiences for your users. These maps help users visualize and analyze real-time and historical data based on user input, allowing them to pan, zoom, and explore the map in real-time. Maps offered by Amazon Location Service also support multiple languages and political views.

Learn more about [Localization and internationalization](maps-localization-internationalization.md).

For example requests, responses, cURL, and CLI commands for this API, see [How to use dynamic maps](https://docs.aws.amazon.com/location/latest/developerguide/dynamic-maps-how-to.html).

------
#### [ City ]

![\[alt text not found\]](http://docs.aws.amazon.com/location/latest/developerguide/images/dynamic-city.png)


------
#### [ Roads ]

![\[alt text not found\]](http://docs.aws.amazon.com/location/latest/developerguide/images/dynamic-roads.png)


------
#### [ Park ]

![\[alt text not found\]](http://docs.aws.amazon.com/location/latest/developerguide/images/dynamic-parks.png)


------

For more information about AWS Map Styles, see [AWS map styles and features](map-styles.md).

## Common use cases
<a name="common-use-cases"></a>

**Analyze and visualize data**  
Overlay your data onto high-quality maps to uncover transformative spatial patterns and trends. Empower your teams to create customizable, interactive map visualizations with your geographic data. Use maps and data to optimize site selection, plan infrastructure, or analyze market opportunities.

**Enhance real estate experiences**  
Provide prospective buyers with comprehensive location context for real estate listings. Display the property's exact location along with surrounding neighborhood details such as jurisdictional boundaries, local businesses, parks, and schools. Help customers find directions to your open houses and create informative, location-centric real estate experiences.

**Build engaging travel experiences**  
Display dynamic maps showcasing destinations, with detailed street views and key geographic features. Highlight points of interest such as hotels, restaurants, and attractions for tourists and travelers. Plot outdoor amenities like hiking trails to help users plan their ideal itinerary.

## Rendering dynamic maps
<a name="rendering-dynamic-map"></a>

A map rendering engine is a library responsible for the visual rendering of maps on digital screens. The rendering engine stitches map tiles (vector, hybrid, satellite), map data (points, lines, polygons), or raster data (imagery) together to display an interactive map in web browsers or native apps. Amazon Location Service recommends using the [MapLibre](https://github.com/maplibre/maplibre-gl-js) rendering engine, which supports both web and mobile (iOS and Android) platforms. MapLibre also provides a plugin model and supports user interfaces for searching and routing in various languages.

For more information, see [Create your first Amazon Location Maps and Places application](first-app.md).

## Requesting map assets
<a name="requesting-map-assets"></a>

The rendering engine uses a map style, which contains references to map tiles, sprites (icons), and glyphs (fonts). As users interact with the map—loading, panning, or zooming—the rendering engine calls APIs (for tiles, sprites, and glyphs) with the desired input parameters. You can also directly call these APIs based on your application's needs.

**Map tiles**  
Small square tiles containing data that are retrieved from servers and assembled by a rendering engine to create an interactive digital map.

**Map style**  
A collection of rules that define the visual appearance of the map, such as colors and styles. Amazon Location Service follows the [Mapbox GL style specification](https://docs.mapbox.com/style-spec/guides/).

**Glyph file**  
A binary file containing encoded Unicode characters, used by the map renderer to display text labels.

**Sprite file**  
A Portable Network Graphics (PNG) image file that contains small raster images, with location descriptions in a JSON file. Used by the map renderer to render icons or textures on the map.

# Tiles
<a name="tiles"></a>

Map tiles are pre-rendered, small sections of a larger map, typically displayed as square images. They are used to efficiently display geographic data by loading only the visible portions at different zoom levels. There are three main types of map tiles:

For more information, see [GetTile](https://docs.aws.amazon.com/location/latest/APIReference/API_geomaps_GetTile.html) in the *Amazon Location Service API Reference*.

## Tile types
<a name="tile-types"></a>

**Vector map tiles**  
Vector map tiles store map data as geometric shapes (points, lines, polygons) rather than as images. This enables the creation of high-quality, scalable maps that remain clear at any resolution.

**Raster map tiles**  
Raster map tiles are pre-rendered images representing a specific geographic area. Unlike vector tiles, raster tiles are simpler but lack flexibility for restyling.

**Hybrid map tiles**  
Hybrid map tiles combine both vector and raster data. They use vector data for core map elements, such as roads, while using raster imagery for more complex elements like detailed satellite or aerial photography.

## Vector tile layers
<a name="vector-tiles-layers"></a>

The following are the 10 layers of vector map tiles:
+ **Boundaries**: Defines administrative and geographic boundaries, including country, state, and city borders.
+ **Buildings and addresses**: Represents building shapes and detailed address points.
+ **Earth**: Shows global terrain and surface coverage for natural features like deserts, mountains, and forests.
+ **Land use**: Displays categorized areas such as parks, farmland, and urban zones.
+ **Places**: Identifies important locations like cities, towns, and notable landmarks.
+ **Points of interest (POIs)**: Highlights attractions, businesses, and other key locations.
+ **Roads**: Represents the network of streets, highways, and pathways.
+ **Road labels**: Provides text labels for road names and route numbers.
+ **Transit**: Depicts public transport lines such as buses, trains, and subways.
+ **Water**: Displays bodies of water, including lakes, rivers, and oceans.

## Use cases
<a name="tiles-use-cases"></a>
+ Fetching map tiles for rendering different sections of a map at various zoom levels.
+ Optimizing map tile requests based on user interaction, such as panning and zooming.
+ Accessing vector or raster tiles for detailed rendering purposes.

## Understand the request
<a name="tiles-understand-the-request"></a>

**Note**  
 For customers in `ap-southeast-1` and `ap-southeast-5`, supported request and response fields may differ. Refer to the [GetTile API Reference](https://docs.aws.amazon.com/location/latest/APIReference/API_geomaps_GetTile.html) for details. 

The request requires the following parameters: `Tileset`, `X`, `Y`, and `Z` to identify the specific tile to be fetched. The `Key` parameter can be optionally included for authorization.
+ **`Tileset`**: Specifies the desired tileset for fetching the tile.
+ **`X`**: The X-axis value for the map tile.
+ **`Y`**: The Y-axis value for the map tile.
+ **`Z`**: The zoom value, defining the zoom level for the tile.
+ **`Key`**: Optionally included for authorization purposes.

## Understand the response
<a name="tiles-understand-the-response"></a>

The response includes headers such as `CacheControl`, `ContentType`, and `ETag`, and contains the map tile data as a binary blob in MVT format. These headers manage cache control, provide content format details, and version control for tiles.
+ **`CacheControl`**: Controls client-side caching for the map tile.
+ **`ContentType`**: Specifies the format of the tile data.
+ **`ETag`**: Provides a version identifier for the tile.
+ **`Blob`**: Contains the vector tile data in MVT format.

# Style dynamic maps
<a name="styling-dynamic-maps"></a>

Amazon Location Service provides two options for styling your dynamic maps: using predesigned AWS Map Styles or customizing the map style using style descriptors.

For more information, see [GetStyleDescriptor](https://docs.aws.amazon.com/location/latest/APIReference/API_geomaps_GetStyleDescriptor.html) in the *Amazon Location Service API Reference*.

## Use predesigned AWS map styles
<a name="using-aws-map-styles"></a>

AWS map styles are predefined styles that adhere to industry standards to deliver a sophisticated, professional aesthetic. By leveraging these styles in Amazon Location Service, you can reduce time-to-market and eliminate the need for dedicated cartographers to create map styles from scratch.

For more information, see [AWS map styles and features](map-styles.md).

To learn more about predefined map styles, see:
+ [Standard map style](map-styles.md#standard-map)
+ [Monochrome map style](map-styles.md#monochrome-map)
+ [Hybrid map style](map-styles.md#hybrid-map)
+ [Satellite map style](map-styles.md#satellite-map)

## Add map style features to your AWS map
<a name="using-aws-map-features"></a>

AWS map style features enable you to customize your maps with advanced style features including terrain, contour density, traffic, and truck or transit overlays. These new customization options allow you to tailor map appearances to specific use cases.

For more information, see [map features](https://docs.aws.amazon.com/location/latest/developerguide/maps-concepts.html).

## Benefits of using AWS map styles
<a name="benefits-aws-map-styles"></a>
+ **Time and resource efficiency**: AWS Map Styles allow you to bypass the time-consuming and resource-intensive process of designing map styles from scratch. This allows you to focus on core functionalities while providing visually appealing maps.
+ **Professional and consistent aesthetics**: Skilled cartographers have meticulously crafted AWS Map Styles, following industry best practices. Every detail, from color palettes to label placements, has been optimized for clarity and legibility.
+ **Seamless integration**: AWS Map Styles integrate seamlessly with your application's design language, providing a polished and consistent mapping experience for your end-users.

## Get started with AWS map styles
<a name="getting-started-aws-map-styles"></a>
+ **Check the AWS map styles offering**: In the Amazon Location Service console, navigate to the **Map** section to explore the available styles.
+ **Choose the style that matches your needs**: Select the style that best aligns with your application's design and user experience requirements.
+ **Integrate the style**: Follow the provided documentation to integrate the chosen style into your application using Amazon Location Service APIs or SDKs.

Learn more about [How to display a map](how-to-display-a-map.md).

## Use cases
<a name="use-cases"></a>
+ Customizing map styles based on color schemes like `Light` or `Dark`.
+ Displaying maps according to specific political views or geographic boundaries.
+ Optimizing map styles for different use cases, such as logistics, outdoor activities, navigation with traffic data, and transportation-specific routing.

## Understand the request
<a name="dynamic-understand-the-request"></a>

**Note**  
 For customers in `ap-southeast-1` and `ap-southeast-5`, supported request and response fields may differ. Refer to the [GetStyleDescriptor API Reference](https://docs.aws.amazon.com/location/latest/APIReference/API_geomaps_GetStyleDescriptor.html) for details. 

The request supports parameters like `ColorScheme`, `Key`, and `PoliticalView` to define the map's style and presentation. The `Style` parameter is required to specify the desired map style.
+ **`ColorScheme`**: Sets the map's color palette, such as `Light` or `Dark`.
+ **`PoliticalView`**: Specifies the political view for map visualization.
+ **`Style`**: Defines the style of the map, like `Standard` or `Monochrome`.
+ **`Terrain`**: Displays topographic features through elevation shading and geographic highlighting.
+ **`ContourDensity`**: Shows terrain shape and steepness using elevation contour lines at varying density levels.
+ **`Traffic`**: Overlays real-time traffic conditions on the map.
+ **`TravelMode`**: Displays transportation information including public transit systems or truck routing with road restrictions.

## Understand the response
<a name="dynamic-understand-the-response"></a>

The response provides headers like `CacheControl`, `ContentType`, and `ETag`, and contains the style descriptor as a JSON blob. The headers give caching information, content format details, and versioning for style changes.
+ **`CacheControl`**: Controls caching configurations for the style descriptor.
+ **`ContentType`**: Indicates the response format as JSON.
+ **`ETag`**: Provides a version identifier for the style descriptor.
+ **`Blob`**: Contains the body of the style descriptor in JSON format.

## Customize style descriptors
<a name="customizing-style-descriptor"></a>

To customize map styles, you must understand the structure of the style descriptor, which is usually a JSON object defining the visual representation of map elements. The style descriptor comprises several layers, each controlling the style for a specific type of map element, such as roads, parks, buildings, or labels.
+ **Use a predefined style descriptor as a base**: You can either start with a predefined style descriptor or create one from scratch using map style editors such as [Maputnik](https://maputnik.github.io/).
+ **Understand the structure**: The style descriptor is a hierarchical JSON object that contains layers, each representing a different map element. Each layer has properties that control the visual appearance of that element, such as color, opacity, and line width.
+ **Modify styles for layers**: Depending on the map style editor you’re using, you can change existing layers or add new ones to customize the style. For example, you can adjust the color of roads, modify the font size of labels, or add custom icons for specific locations.
+ **Define styles for different zoom levels**: Map style editors allow you to define different styles for different zoom levels, which is useful for controlling the level of detail and visibility based on user zoom interactions.
+ **Test and iterate**: After modifying or creating the style descriptor, test the customized style on a map to ensure it displays as intended. Iterate and adjust until you achieve the desired visual style.

# Style iconography with sprites
<a name="styling-iconography-with-sprites"></a>

A sprite is a Portable Network Graphic (PNG) image file that contains small raster images such as icons, markers, and other elements rendered on a map. Sprites can be customized based on parameters like style, color scheme, and variant. Amazon Location Service provides a sprite sheet through the `GetSprites` API. You can also use custom icons by either loading your own icon set (see [How to add an icon on the map](how-to-add-icon-on-map.md)) or customizing the style descriptor to load your custom sprites.

For more information, see [GetSprites](https://docs.aws.amazon.com/location/latest/APIReference/API_geomaps_GetSprites.html) in the *Amazon Location Service API Reference*.

## Use cases
<a name="use-cases"></a>
+ Rendering custom map elements using sprite sheets for specific styles and color schemes.
+ Fetching sprites for various map styles such as Standard, Monochrome, or Hybrid.
+ Customizing iconography on the map by modifying sprites.

## Understand the request
<a name="styling-understand-the-request"></a>

The request requires URI parameters such as `ColorScheme`, `FileName`, and `Style`. These parameters allow for the customization of the sprite sheet based on the map's color scheme, style, and the specific sprite file required.
+ **`ColorScheme`**: Defines the color scheme for the sprites, such as "Light" or "Dark".
+ **`FileName`**: The name of the sprite file to retrieve, which could be a PNG or JSON file.
+ **`Style`**: Specifies the map style, such as "Standard" or "Monochrome".

## Understand the response
<a name="styling-understand-the-response"></a>

The response contains headers such as `CacheControl`, `ContentType`, and `ETag`, and returns the sprite data as either a binary blob or a JSON file. These headers provide caching information, the content type of the response, and version control for the sprite data.
+ **`CacheControl`**: Caching configurations for the sprite file.
+ **`ContentType`**: The format of the response, indicating whether it contains PNG or JSON data.
+ **`ETag`**: Identifier for the sprite's version, used for cache validation.
+ **`Blob`**: Contains the body of the sprite sheet or the JSON offset file.

------
#### [ Standard Light ]

![\[Collection of colorful icons representing various services and concepts in cloud computing.\]](http://docs.aws.amazon.com/location/latest/developerguide/images/styling-standard-light.png)


------
#### [ Standard Dark ]

![\[Collection of colorful icons and shapes representing various services and concepts.\]](http://docs.aws.amazon.com/location/latest/developerguide/images/styling-standard-dark.png)


------
#### [ Monochrome Light ]

![\[Collection of various icons and shapes representing different concepts and services.\]](http://docs.aws.amazon.com/location/latest/developerguide/images/styling-monochrome-light.png)


------
#### [ Monochrome Dark ]

![\[Collection of various icons and shapes representing different concepts and services.\]](http://docs.aws.amazon.com/location/latest/developerguide/images/styling-monochrome-dark.png)


------
#### [ Hybrid ]

![\[Collection of colorful icons representing various travel, transportation, and service symbols.\]](http://docs.aws.amazon.com/location/latest/developerguide/images/styling-hybrid.png)


------

# Style labels with glyphs
<a name="styling-labels-with-glyphs"></a>

Glyphs are binary files containing encoded Unicode characters, which are used by a map renderer to display labels. Amazon Location Service enables the retrieval of specific glyphs from a font stack for use in map rendering through the `GetGlyphs` API.

For more information, see [GetGlyphs](https://docs.aws.amazon.com/location/latest/APIReference/API_geomaps_GetGlyphs.html) in the *Amazon Location Service API Reference*.

## Use cases
<a name="glyphs-use-cases"></a>
+ Rendering custom text on maps with specific fonts and styles.
+ Fetching glyphs for localized map text rendering.
+ Using Unicode character ranges to display map labels and symbols.
+ Optimizing map font rendering based on font stacks and glyph ranges.

## Supported fonts in API
<a name="supported-fonts"></a>

The following fonts are supported in the API:
+ Amazon Ember Bold
+ Amazon Ember Bold Italic
+ Amazon Ember Bold,Noto Sans Bold
+ Amazon Ember Bold,Noto Sans Bold,Noto Sans Arabic Bold
+ Amazon Ember Condensed RC BdItalic
+ Amazon Ember Condensed RC Bold
+ Amazon Ember Condensed RC Bold Italic
+ Amazon Ember Condensed RC Bold,Noto Sans Bold
+ Amazon Ember Condensed RC Bold,Noto Sans Bold,Noto Sans Arabic Condensed Bold
+ Amazon Ember Condensed RC Light
+ Amazon Ember Condensed RC Light Italic
+ Amazon Ember Condensed RC LtItalic
+ Amazon Ember Condensed RC Regular
+ Amazon Ember Condensed RC Regular Italic
+ Amazon Ember Condensed RC Regular,Noto Sans Regular
+ Amazon Ember Condensed RC Regular,Noto Sans Regular,Noto Sans Arabic Condensed Regular
+ Amazon Ember Condensed RC RgItalic
+ Amazon Ember Condensed RC ThItalic
+ Amazon Ember Condensed RC Thin
+ Amazon Ember Condensed RC Thin Italic
+ Amazon Ember Heavy
+ Amazon Ember Heavy Italic
+ Amazon Ember Light
+ Amazon Ember Light Italic
+ Amazon Ember Medium
+ Amazon Ember Medium Italic
+ Amazon Ember Medium,Noto Sans Medium
+ Amazon Ember Medium,Noto Sans Medium,Noto Sans Arabic Medium
+ Amazon Ember Regular
+ Amazon Ember Regular Italic
+ Amazon Ember Regular Italic,Noto Sans Italic
+ Amazon Ember Regular Italic,Noto Sans Italic,Noto Sans Arabic Regular
+ Amazon Ember Regular,Noto Sans Regular
+ Amazon Ember Regular,Noto Sans Regular,Noto Sans Arabic Regular
+ Amazon Ember Thin
+ Amazon Ember Thin Italic
+ AmazonEmberCdRC\$1Bd
+ AmazonEmberCdRC\$1BdIt
+ AmazonEmberCdRC\$1Lt
+ AmazonEmberCdRC\$1LtIt
+ AmazonEmberCdRC\$1Rg
+ AmazonEmberCdRC\$1RgIt
+ AmazonEmberCdRC\$1Th
+ AmazonEmberCdRC\$1ThIt
+ AmazonEmber\$1Bd
+ AmazonEmber\$1BdIt
+ AmazonEmber\$1He
+ AmazonEmber\$1HeIt
+ AmazonEmber\$1Lt
+ AmazonEmber\$1LtIt
+ AmazonEmber\$1Md
+ AmazonEmber\$1MdIt
+ AmazonEmber\$1Rg
+ AmazonEmber\$1RgIt
+ AmazonEmber\$1Th
+ AmazonEmber\$1ThIt
+ Noto Sans Black
+ Noto Sans Black Italic
+ Noto Sans Bold
+ Noto Sans Bold Italic
+ Noto Sans Extra Bold
+ Noto Sans Extra Bold Italic
+ Noto Sans Extra Light
+ Noto Sans Extra Light Italic
+ Noto Sans Italic
+ Noto Sans Light
+ Noto Sans Light Italic
+ Noto Sans Medium
+ Noto Sans Medium Italic
+ Noto Sans Regular
+ Noto Sans Semi Bold
+ Noto Sans Semi Bold Italic
+ Noto Sans Thin
+ Noto Sans Thin Italic
+ NotoSans-Bold
+ NotoSans-Italic
+ NotoSans-Medium
+ NotoSans-Regular
+ Open Sans Regular,Arial Unicode MS Regular

## Understand the request
<a name="glyphs-understand-the-request"></a>

The request accepts two required URI parameters, `FontStack` and `FontUnicodeRange`, which determine the font and the Unicode range for glyphs. The `FontStack` parameter specifies which font to use, while the `FontUnicodeRange` defines the character range to fetch. The request does not include a body, focusing only on the URI parameters for its functionality.
+ **`FontStack`**: Specifies the name of the font stack to retrieve. Example: "Amazon Ember Bold, Noto Sans Bold".
+ **`FontUnicodeRange`**: A Unicode range of characters to download glyphs for. The range must be multiples of 256. Example: "0-255".

## Understand the response
<a name="glyphs-understand-the-response"></a>

The response returns glyph data as a binary blob, along with HTTP headers for caching, content type, ETag, and pricing information. The glyph data is returned as a binary blob to be rendered on maps, and the headers provide additional metadata for handling the response effectively.
+ **`CacheControl`**: Instructs the client on caching configurations for the response.
+ **`ContentType`**: Specifies the format of the response body, indicating the type of glyph data returned.
+ **`ETag`**: An identifier for the glyph's version, used for cache validation.
+ **`PricingBucket`**: Indicates the pricing tier associated with the request.
+ **`Blob`**: The glyph data returned as a binary blob, used to render map text.