Barcelona 3D
A low-poly maquette of Barcelona you can spin in the browser. Drag to turn the city, click a landmark for its story, follow a tram along the real Trambaix and Trambesòs tracks, and walk the Ruta Gaudí.
It is a static site: index.html at the repository root, no build step. Three.js is loaded from jsDelivr. Open index.html with any static server (modules will not load from file://).
The live site will be deployed on Vercel from this repository.
License
The code is MIT, copyright Antoni Bassols López.
Photographs in img/ keep their own Wikimedia Commons licenses. They are not MIT. Each card credits the author, the license and the Commons file page. Map geometry (coast, rivers, parks, port, avenues, tram tracks, metro entrances and station positions) is derived from OpenStreetMap and simplified for the maquette.
© OpenStreetMap contributors, ODbL.
What's on the maquette
- 32 landmarks at OpenStreetMap coordinates, including eight Gaudí works with extra low-poly models and trencadís colour: Sagrada Família, Park Güell, Casa Batlló, Casa Milà, Casa Vicens, Palau Güell, Bellesguard and the Pavellons Güell.
- A Gaudí filter in the monument list and a Ruta Gaudí that visits them in chronological order.
- Coastline, Port Vell, Ciutadella, Montjuïc, Park Güell, La Rambla, Diagonal, Gran Via, Passeig de Gràcia, and the Besòs and Llobregat.
- Trams T1, T2 and T4 animated on the street-level tracks. T4 in this extract runs the Diagonal link and ends at Verdaguer. Click a tram to follow it.
- Metro and rail entrances as an optional layer (off by default), coloured by line where the entrance name matches a stop. No underground tracks are drawn. The main stations marked are Sants, Passeig de Gràcia, Plaça Catalunya, França, El Clot and La Sagrera.
Spanish is the default language. English, day and night, and a lighter mode for phones (no depth of field, no shadows) are built in.
Photo credits
