# Dubai Dream: a Mapbox map with a 3D layer on top

> An interactive Dubai map built with Mapbox and a Three.js layer: pan and zoom the real map, click landmarks and dive into stylized geometry.

Canonical page: https://andersonmancini.dev/blog/dubai-dream-mapbox

Published: 2026-08-21 · 1 min read · Tags: three.js, mapbox, maps, webgl, launch

Maps and 3D usually live in separate worlds: the map is a flat layer, and the 3D is a viewer that opens on a click. Dubai Dream puts them in the same view, with **Mapbox** underneath and a 3D layer on top.

![Dubai Dream, a map with 3D buildings](https://andersonmancini.dev/images/dubai_dream.webp)

## How it feels

You explore the city from above, click the landmarks and dive into stylized geometry that sits naturally over the real geography. Map navigation and WebGL visuals work as one experience: pan and zoom the map, and the 3D elements respond as you move through districts and points of interest.

## The concept

It is a travel-meets-tech concept: part cartography, part immersive preview of a destination, rendered in real time.

## Try it

The map is live at [dubai-dream.vercel.app](https://dubai-dream.vercel.app/), and the details are on the [project page](https://andersonmancini.dev/projects/dubai-dream.md).

## Related projects

- [Dubai dream](https://andersonmancini.dev/projects/dubai-dream.md) — Interactive Dubai Map using MapBox