Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of HTML Starter

Public visualization

Viewing a saved revision (read-only)

99ed43a62adb4dea972e2f398e0d2cee

Fork of HTML Starter

1 star1🌍 Public
CCurran Kelleher
Last edited Jul 16, 2025
Created on Jul 16, 2025
Forked from HTML Starter

This example shows a starfield animation that simulates traveling through space. The code generates 1,000 star elements with randomized positions, sizes, and speeds, then animates them using D3’s data join and `requestAnimationFrame`. Each star’s 3D translation and opacity update as it moves along the z-axis, with mouse movement dynamically shifting the perspective origin. The animation rebuilds on window resize, resetting all stars. It uses D3 v7 selections and DOM manipulation, CSS 3D transforms, and the native `requestAnimationFrame` API.

AI-generated description

Starfield Animation

A simple starfield animation using D3.js.

Features

  • Randomized star positions, sizes and speeds
  • Responsive to window resize
  • Smooth animation using requestAnimationFrame

How to Run

Simply open index.html in a web browser.