Glossary Docs Developers ↗
Extension

City Diorama

Any place on earth as a miniature: real streets, water and building footprints raised into a chunk of city - or wrapped around a sphere as a tiny planet.

4 sections25 entriesAll extensions ↗

City Diorama (overview & stage) Extension 5 items #

Any place on earth as a miniature: real streets, water and building footprints raised into a chunk of city - or wrapped around a sphere as a tiny planet.

Search a street with its town, drag the circle on the overview map until the corner you meant sits in the middle, and choose how much ground the piece takes. The map data comes from OpenStreetMap through your own site, so the browser never talks to the map services itself, and the attribution the licence asks for is drawn into the picture.

Drag the stage to orbit, hold Shift and drag to move the map underneath, scroll to zoom. More ground is fetched than the cut shows, so moving around inside the neighbourhood costs no waiting.

Places

#

Ten starter places with their coordinates built in, from Midtown and the Speicherstadt to Shibuya and Alfama. They work without a search, so a first diorama is one click.

Count10 places

Overview map

#

A flat map of the whole fetched neighbourhood with the diorama drawn on it as a bright circle. Dragging the circle moves the diorama instantly - the data is already in memory - and only a move that reaches the edge of it fetches more.

Radius

#

How much ground the piece covers, from 200 m to 1600 m. It is also the character dial for the globe: the sphere is the area rolled up, so a wide area makes a planet and a narrow one makes a bristly asteroid.

Range200 - 1600 m

Turn the city

#

Turns the city underneath a fixed shape, which is what decides which streets end up inside a heart or a square. The painted ground and the buildings turn together.

The chunk, and the tiny planet Extension 6 items #

The shape the piece is cut with, what it stands on, and the globe that wraps the whole area around a sphere.

Shape

#

Circle, square, rounded square, hexagon, octagon, heart, a torn chunk with a seeded outline - and Tiny planet, which is not a cut at all. Every shape covers about the same amount of ground at the same radius.

Count8 shapes

Base

#

What the city stands on: a clean cut, a chunk torn from the ground with a faceted rocky flank, a tapered block, a plinth, or an island running to a point.

Count5 bases

Depth

#

How deep the piece was cut out of the ground, from 60 m to 900 m. Only the slab shapes use it.

Tiny planet

#

The area wrapped onto a sphere: the centre of the map becomes the north pole and the streets run over the horizon and back. The ground is wrapped distance for distance so the city keeps its proportions, while the buildings stand rigid on the tangent plane at their own spot, like model houses glued to a globe. Choosing it widens a small area, because the sphere is the area rolled up.

Wrap around

#

How far around the sphere the area reaches, from a cap with plain ground behind it to the whole globe.

Range25 - 100 %

Atmosphere

#

A shell of light around the planet, catching the sun color at its rim.

The city: massing, looks and light Extension 8 items #

Where the building heights come from, the fourteen looks, and the sun.

Building height

#

Lifts the low mass of the city until the streets read as canyons, while real landmarks keep close to their true proportion - a church tower stays a tower instead of becoming an antenna.

Range100 - 300 %

Measured and estimated heights

#

OpenStreetMap knows the height of some buildings and says nothing about the rest - often about half of them in a city centre, almost none in a village. What is measured is used as it stands. The rest is estimated by asking the measured neighbours first, because buildings stand in blocks and a block has one building culture, and by footprint size where the area is silent. The status line says how many were measured.

Towers with parts

#

Where a building outline carries the height of its tallest section and building:part pieces carry the real massing, the parts are used and the outline steps aside. That is what gives skyscrapers their setbacks instead of a block-sized slab at tower height.

Smallest building

#

The height nothing falls below, so a shed still reads as a building.

Range2 - 20 m

Trees

#

Where the map lists trees they stand where they really stand; otherwise a few are scattered over the green areas.

Variation

#

Rolls a new seed. Everything estimated - heights, tree places, the torn rim - is deterministic, so the same place and the same seed always give the same diorama.

Looks

#

Clay model, Cartoon with inked edges, Low poly, Porcelain, Brass & marble, Paper city, Blueprint, Neon, Timber model, First snow, Watercolor, Noir, Candy, and City at night with lit windows and street lamps. A look decides the ground, the walls, the edges and the light together.

Count14 looks

Light

#

Sun direction and sun height place the shadows; Shadows sets how hard they are; Lit windows turns the windows on before dark.

Markers, routes and what gets inserted Extension 6 items #

Marking the spots that matter, joining them, and what arrives in the document.

Markers

#

Click the ground in the view to drop a marker on your house, your venue or your shop, and give it a name. Up to twelve per scene, as a beam of light, a pin or a ring.

Countup to 12

Labels

#

Marker names are drawn flat over the finished picture, upright and readable whatever the camera does, and stepped apart where two of them would overlap. The preview and the exported picture use the same drawing.

Route

#

Joins the markers, either one after another or all from the first, as a line that arcs above the roofs. Color, arc height and width are yours.

Title, subtitle and coordinates

#

Inserted as editable text layers, never baked into the picture, so the type stays yours to restyle.

Insert

#

Everything arrives as one group: the diorama as an image layer that keeps its settings, plus the caption layers. Reopen it any time through Edit City Diorama and the layer is updated in place.

Show document

#

Renders your current design behind the transparent diorama, so you can see how it will sit before you insert it.