Editor’s Note: This post is part of our Google I/O 2024 series sharing the latest Google Maps Platform news from our annual developer conference. To learn how to create immersive map visualization experiences using Photorealistic 3D Maps in Maps JavaScript API, register for our session scheduled for May 16.

Maps JavaScript is the cornerstone of dynamic mapping experiences, powering websites and applications with our rich basemap and information about more than 250 million places and businesses around the world. It’s fueled innovation—shaping the way we book vacations, order food, or simply locate a new coffee shop. But maps provide more than just utility–they’re more immersive than ever before. They deliver experiences that bring the digital and real worlds together to help people better understand the context, stories, and brands around them–and so much more. To help build more immersive experiences, developers can now use the Experimental release of Photorealistic 3D Maps in the Maps JavaScript API. This release gives Google Maps Platform developers access to a real-world canvas to build on, powered by Google’s rendering technology.

Mapping a new dimension of web experiences

Accessing high quality 3D imagery and navigating the complexities of 3D rendering to build 3D experiences can be challenging. This is why one of the top requests from our web developers has been to access a real-world 3D experience in Maps JavaScript. Our goal is to help bridge these gaps by providing the power of 3D, natively rendered within a familiar development framework, so you can deliver 3D mapping experiences at the speed your users expect. By using 3D Maps you can focus more time on building your application and less time worrying about selecting a renderer or building capabilities in-house. Plus, you can get started with just a single line of code: <gmp-map-3d />.

With Photorealistic 3D Maps now available in the Maps JavaScript API, it is so much easier to choose a 3D environment instead of a 2D environment just because of the ease of use and the speed. Before it was always a very careful decision whether we should venture into the 3D world because we had to rely on large application bundles and a sub-optimal developer experience. With this release, 3D has just become more prominent in the options we have. Patrick Mast Project Manager, Ubilabs

A places-rich base map 

3D Maps brings Google’s extensive 3D coverage—available in over 2,500 cities in more than 50 countries—directly to your applications via the Maps JavaScript API. This means your 3D canvas automatically includes all the rich places data and labeling that you and your users expect from a Google map. This comprehensive map makes it possible to deliver impactful 3D visualizations so that users can better orient themselves and get more location context to virtually explore an area. And, for experiences where you want to emphasize the 3D imagery, you have the flexibility to hide the map features for a clean, focused view.

Create powerful visualizations with ease and familiarity

Like other features in Maps JavaScript, 3D Maps was designed as a web component to enable easier web development using either HTML or JavaScript. Using these elements, you can overlay and style polygons and polylines, add a third dimension with extrusion, and control the visibility to expose the underlying 3D map features. Customizing these visualizations allows you to tailor your 3D map, whether you’re highlighting specific areas of interest, visualizing routes, or drawing attention to key location-based information.

Flexible controls to build more dynamic experiences

3D Maps provides a real-world backdrop for web experiences, whether it’s an individual block or a full globe view. Flexible camera controls and event listeners allow you to orient the 3D map around specific areas, create more guided exploration within a 3D scene, and respond directly to user interactions. These simple optimizations help create a more dynamic and engaging map experience.

Even more choice to create immersive experiences 

Last year we introduced Aerial View and Photorealistic 3D Tiles in the Map Tiles API, giving developers access to Google’s real world assets. With today’s release, we’ve extended our portfolio of products that help you create immersive experiences even further. Whether you want a pre-rendered video using Aerial View, use your own renderer with Map Tiles, or leave the rendering to us in your JavaScript applications, there’s an option for you. 

Get started

Try out Photorealistic 3D Maps in Maps JavaScript at no cost during the Experimental phase. If you’re an existing Maps JavaScript customer, you can get started right away. If you’re new to Maps JavaScript, simply enable the Maps JavaScript API in the Cloud console to start using 3D Maps. Watch the demo and check out the documentation to learn more. You can also submit feedback and feature requests through the public issue tracker. And as you build exciting immersive experiences, don’t forget to tag Google Maps Platform on LinkedIn. We can’t wait to see what you build.