Skip to main content
SimilarExport ZIP
100%

Game of Life on a Torus

✓ Published0🌍 Public
CCurran Kelleher
Last edited May 15, 2025
Created on May 15, 2025

A glossy, metallic torus rotates in 3D space, its surface displaying Conway's Game of Life evolving in real time. The simulation runs on a 128×128 canvas texture, with each generation updating every 150 milliseconds using toroidal boundary conditions. Three.js renders the scene with WebGL, while React 19 manages the component lifecycle and OrbitControls enable interactive zooming and rotation.

AI-generated description

Torus Example

A simple example of a 3D torus implemented with React 19 and Three.js (no react-three-fiber).

Features:

  • Glossy torus with metallic material
  • Game of Life simulation texture that evolves over time
  • Auto-rotation for dynamic visualization
  • Orbit controls for interactive viewing
  • Responsive design that adjusts to window size

Drag to orbit, scroll to zoom, and enjoy the shiny torus with Conway's Game of Life playing across its surface!

MIT Licensed

Similar vizzes

Loading thumbnail…

Game of Life (Possibly)

A grid of 10 by 5 cells displays Conway's Game of Life, with each cell toggling between alive (yellow) and dead based on neighbor counts. The simulation updates every two seconds, using a random Bernoulli distribution (d3.randomBernoulli) to generate the initial state. React hooks manage the cell matrix state, while SVG rectangles render the grid within a VizContainer. The code implements the game rules through countNeighbors and go functions, using setInterval for animation.

WWaseem Medhat
75% match
Loading thumbnail…

React & D3 Starter

A rotating torus knot rendered in three.js WebGL demonstrates a React component lifecycle. The App component instantiates a Three.js scene, perspective camera, and WebGL renderer, appending the canvas to a ref-mounted div. A `MeshPhongMaterial` with a neon specular highlight receives directional lighting, while the animation loop increments rotation on both axes. The example integrates React with imperative Three.js setup, using `useEffect` for scene creation and cleanup.

MMichael Bergerson
72% match
Loading thumbnail…

pro_2

A single pink torus rotates slowly in a dark blue 3D scene, with interactive camera controls that let viewers orbit around the object. The visualization uses Three.js with WebGL rendering, creating a MeshPhongMaterial that responds to ambient and directional lighting for realistic shading. An animation loop updates the torus rotation and calls OrbitControls for smooth damping, while a window resize listener keeps the perspective camera aligned with the viewport. The scene demonstrates basic Three.js geometry, lighting, and animation in a minimal setup.

Aarchanaadharani1@gmail.com
71% match
Loading thumbnail…

Conway's Game of Life

The example implements Conway’s Game of Life on a 64×128 SVG grid, rendering each cell as a rectangle. It shows cellular automaton patterns evolving over time under the standard birth, survival, and death rules, with controls to select sample patterns, start or pause simulation, and edit the grid by clicking cells. The JavaScript uses D3 v3 to bind grid data to SVG rects and to update fills, while the simulation logic is implemented with bitwise operations on typed arrays for efficient neighbor counting and state transitions. Predefined patterns, such as “Planes” and “Symm 4,” are included in a separate data file.

NNPashaP
70% match
Loading thumbnail…

React + ThreeJS 3D Cube of Spheres

This example displays a three-dimensional cube of spheres, arranged in a 4x4x4 grid, with each sphere’s color determined by its position via an HSL calculation. The entire structure rotates automatically, while users can drag to orbit the view and scroll to zoom, thanks to Three.js’s `OrbitControls`. The scene is built with React 19, which manages the mount point and lifecycle, while Three.js handles WebGL rendering, including `MeshPhongMaterial` for coloring and `DirectionalLight` for illumination.

CCurran Kelleher
68% match
Loading thumbnail…

Toric Voronoi

This example demonstrates a Voronoi diagram on a torus, where 300 random points create cells that wrap seamlessly across the canvas edges. It shows how the cell structure repeats across a virtual cylinder in both horizontal and vertical dimensions, with the interactive site highlighted in red. The code uses d3.voronoi to compute the diagram, duplicating each site into eight shadow copies to handle the toroidal topology, then filtering links between shadow copies. Rendering is done via Canvas 2D context, with polygons, links, and sites drawn as separate paths.

PPhilippe Rivière
68% match
Loading thumbnail…

Vibecoding Test - Psychedelic Game of Life

This interactive visualization reimagines Conway’s Game of Life with a hypnotic, psychedelic aesthetic. It generates a random grid on an HTML5 Canvas and animates cellular evolution through continuously cycling, position-dependent colors, creating a sense of depth and infinity. Built with D3.js, the simulation leverages `requestAnimationFrame` for smooth animation and an offscreen canvas for efficient rendering. Users can click, drag, and toggle color and trail effects; a subtle zoom and rotation of the canvas each frame also produces a tunnel-like visual experience.

CCurran Kelleher
67% match
Loading thumbnail…

Fork of Fork of 3D Cube of Spheres

A ring of colored spheres orbits a central point within a dark 3D space, slowly rotating to reveal its circular arrangement. Built with Three.js, the visualization uses a WebGL renderer and a perspective camera with orbit controls for interactive exploration. Each sphere is positioned using sine and cosine trigonometry, and its hue is mapped to its index around the circle, creating a smooth rainbow gradient. The scene includes directional and ambient lighting, and user-controlled damping enables smooth camera movement.

CCurran Kelleher
65% match