Landscape Generator

January 2026

A Svelte app that uses D3 to draw a random scene

This app creates a random array of numbers and then uses D3 to turn that array into a scene. The data-driven scene comes in two flavors. What started as a bar graph turned into a cityscape and then evolved into a forest. The dimensions of the elements in both versions of the scenes are driven by the random array values, while additional randomness creates variation in the details (lit windows and tree types). There was no particular goal to this project other than playing around and seeing what I could create.

Feel free to check out the app and the source code. Refresh the page to make a new scene.

Topics

  • Data Art

Technologies Used

  • Svelte
  • D3

Challenges & Learnings

The goal of this project was to play around with Svelte and D3 and to see if I could get them to work together with git-hub pages. Svelte was entirely new to me, so it took some time to figure it all out.