Applying masks to Mapbox GL JS maps in 3D

Overview

Your users understand the world in 3D and sometimes 2D maps just don’t cut it. Or 3D maps can provide the extra “wow factor” to create a more engaging experience. The release of Mapbox GL JS v2 and private beta release of the Mobile Maps SDK v10 enables developers to build immersive 3D mapping applications with the same techniques and ease of implementation you’ve come to expect from our tools.

In this webinar, our team will walk through creating a 3D map in Mapbox Studio with visual masks, and provide examples of how you can combine these techniques to delight your users.

You’ll learn how to...

• Create a custom map style with 3D terrain
• Focus your audience’s attention with masking
• Dynamically generate a personal map experience for users

Resources

• Mapbox Studio - Log in
• Mapbox GL JS documentation
• Access Stephen's Github Gist with GeoJSON for Hawai’i mask‍
• Copy Stephen's public Mapbox-hosted style: HVNP-Pineapples