Niantic Maps for Web
Introduction
Niantic Maps for Web provides interactive, real-world 3D maps for integrating geospatial data into AR and 3D experiences. It allows you to anchor AR content to specific real-world locations using Niantic’s mapping infrastructure.
The feature includes built-in 3D terrain, cityscapes, and real-world structures, enabling accurate placement of virtual objects within a mapped environment. This functionality supports location-based applications, including Visual Positioning System (VPS) experiences and real-world AR interactions.
Adding a Maps
You can add a map to your scene by creating a Map entity. To do this, click ( + ) in the Scene Hierarchy and select Map.
Map Configurations
Center and Radius
By default, the map center is set to the device’s GPS location. If needed, you can manually configure the latitude, longitude, and radius to specify a custom location.
You can select the “Use GPS” checkbox to use the device GPS at runtime.
Map Themes
You can customize the map’s appearance by selecting from 20 preset themes. Alternatively, you can adjust individual properties to create a custom theme.
Features
The map is made up of the following features and customization options
- Land: The base of the map, areas where there are no other features.
- Building: Buildings on the map. These can rise above the map.
- Park: Green spaces (natural and man-made).
- Parking: Parking lots.
- Transit: Railroad lines and other transit platforms (e.g. train or ferry).
- Road: Roads of various sizes.
- Sand: Beaches and deserts.
- Water: Bodies of water and waterways.
Feature Attributes
| Attribute | Type | Default | Usage |
|---|---|---|---|
| Land Color | color | #FFFFFF | Color of land as a hexadecimal code |
| Land Opacity | number | 1 | Opacity of land with 0 being transparent and 1 being opaque |
| Land Visibility | boolean | true | Visibility of land as a checkbox |
| Building Color | color | #FFFFFF | Color of buildings as a hexadecimal code |
| Building Opacity | number | 1 | Opacity of buildings with 0 being transparent and 1 being opaque |
| Building Min Height | number | 6 | Min height of buildings in meters |
| Building Max Height | number | 6 | Max height of buildings in meters |
| Building Visibility | boolean | true | Visibility of building as a checkbox |
| Building Base Offset | number | 0.014 | Height of the bottom of buildings, offset from land |
| Park Color | color | #FFFFFF | Color of parks as a hexadecimal code |
| Park Opacity | number | 1 | Opacity of parks with 0 being transparent and 1 being opaque |
| Park Visibility | boolean | true | Visibility of park as a checkbox |
| Park Base Offset | number | 0.002 | Height of the park, offset from land |
| Parking Color | color | #FFFFFF | Color of parking as a hexadecimal code |
| Parking Opacity | number | 1 | Opacity of parking with 0 being transparent and 1 being opaque |
| Parking Visibility | boolean | true | Visibility of parking as a checkbox |
| Parking Base Offset | number | 0.008 | Height of parking, offset from land |
| Transit Color | color | #FFFFFF | Color of transit as a hexadecimal code |
| Transit Opacity | number | 1 | Opacity of transit with 0 being transparent and 1 being opaque |
| Transit Visibility | boolean | true | Visibility of transit as a checkbox |
| Transit Width | number | 6 | Width of transit |
| Transit Base Offset | number | 0.012 | Height of transit, offset from land |
| Road Color | color | #FFFFFF | Color of roads as a hexadecimal code |
| Road Opacity | number | 1 | Opacity of roads with 0 being transparent and 1 being opaque |
| Road Visibility | boolean | true | Visibility of roads as a checkbox |
| Road S Width | number | 2 | Width in meters of S Roads |
| Road M Width | number | 4 | Width in meters of M Roads |
| Road L Width | number | 8 | Width in meters of L Roads |
| Road XL Width | number | 32 | Width in meters of XL Roads |
| Road Base Offset | number | 0.01 | Height of road, offset from land |
| Sand Color | color | #FFFFFF | Color of sand as a hexadecimal code |
| Sand Opacity | number | 1 | Opacity of sand with 0 being transparent and 1 being opaque |
| Sand Visibility | boolean | true | Visibility of sand as a checkbox |
| Sand Base Offset | number | 0.004 | Height of sand, offset from land |
| Water Color | color | #FFFFFF | Color of water as a hexadecimal code |
| Water Opacity | number | 1 | Opacity of water with 0 being transparent and 1 being opaque |
| Water Visibility | boolean | true | Visibility of water as a checkbox |
| Waterway Width | number | 6 | Width of water |
| Water Base Offset | number | 0.006 | Height of water, offset from land |
Map Points
Map points are points anchored to a specified latitude and longitude. By adding an asset as a child of a map point, you can anchor that asset to the latitude and longitude of the map point.
You can create a map point by clicking "New Map Point" in the Inspector Panel and specifying the latitude and longitude.
If you check the "Spawn Locations" checkbox, Studio will procedurally generate a map point at every available location.
Simulator
You can test your map experience using the Simulator. A new dropdown at the top of the simulator allows you to change the latitude and longitude, enabling you to test your experience in different locations. You can also navigate to any location or map point in your project.
Selecting "None" in the dropdown simulates the absence of location data.
