Sun Path & Shadow Simulator

Sun Paths, Shadows and Sun Times for Any Place and Date

A compass ring over a satellite map: pan anywhere on Earth, pick a date, and read sunrise and sunset bearings, solar noon, altitude, azimuth and day length. Drag the day's timeline or play a time-lapse to watch the gold sun marker sweep from sunrise bearing to sunset bearing.

The Sun Path & Shadow Simulator shows where the sun will be over any place on Earth, on any date. It draws the day's sun path as an arc on a compass ring over a map, marks sunrise, solar noon and sunset, and shows the shadow an object of any height casts at any moment. Everything runs in the browser: there's no account, no install and no server behind it.

What it shows

The compass ring is a view of the sky from above: the ring is the horizon and the centre is straight overhead, with guide rings at 30° and 60° of altitude. The day's sun path is drawn as a gold arc, so a long, high summer arc and a short, low winter one are easy to compare. The arc's ends are the sunrise and sunset bearings, a marker at its highest point gives the solar-noon altitude, and a large gold dot shows the sun at the selected time.

A panel beside the map reads out the sun's azimuth and altitude, sunrise, solar noon, sunset and day length, and handles the polar cases, midnight sun and polar night, explicitly. The timeline under it is coloured by the light at each moment of the day: night, astronomical and nautical twilight, civil twilight, golden hour and day. Drag the timeline to scrub through the day, or press play for a time-lapse at four speeds.

Shadows

Set an object's height, such as a 2 m fence, a 10 m tree or a building, and the simulator gives the length and compass direction of its shadow at the selected time, from the sun's altitude and azimuth. Zoomed in to street level, the shadow is drawn to scale on the map; further out, it becomes an arrow showing the direction. The calculation is for a single object on flat, level ground. It doesn't model the surrounding buildings, trees or terrain.

Getting around

Search for a place by name, type coordinates as latitude and longitude, use your device's location, or pan the map. The map switches between satellite imagery, OpenStreetMap streets and a topographic map. The date picker has shortcuts for the solstices and equinoxes, and the keyboard steps the date by day, week or month.

A year of sun times

One button downloads a CSV for the chosen location and year: sunrise, solar noon, sunset, day length, noon altitude, and the sunrise and sunset azimuths for every day. Times are in your browser's time zone, and polar days are marked as midnight sun or polar night instead of being given invented times.

Who it's for

It's for anyone planning around sunlight: gardeners choosing a sunny bed, people looking at a home and wondering which rooms get the morning sun, photographers timing golden hour, and anyone curious why winter days are short or how the sun behaves near the poles and the equator.

How it's built

The page is a single static HTML file served from jedarden.com. Sun positions and times come from the open-source SunCalc library, computed in the browser. The map is Leaflet, with Esri and OpenStreetMap tiles, and place names come from OpenStreetMap's Nominatim service. A Playwright suite covers the solar calculations against reference data, time zones, the mobile layout, accessibility, the overlays, and each feature above.

JavaScriptCanvasLeafletSunCalc

← All projects