Skip to content
Sample of Tron Lightcycle Trails

openprocessing_p5js · TronLightcycle

Tron Lightcycle Trails

Tron-style lightcycle trails. Each cycle moves at a fixed speed along one of four cardinal directions; on a random tick (or before hitting an existing trail) it turns left or right by 90 degrees, leaving behind a glowing tail that the other cycles must avoid. Crashes terminate the offending cycle; survivors continue until all are gone.

Original: https://codepen.io/BretCameron/pen/PoYERQK

▶ Try the live demo (JS port) ▶ Run reference.py via Pyodide 10 formulas have instant JS ports. The Pyodide path runs the actual Python in your browser — first load is ~6 MB, then instant.

Family
openprocessing_p5js
Source
openprocessing · p5.js
Evolution
physics
Render
trail_accumulation
Complexity
medium
Agents
6
Year
2015
Author
community (OpenProcessing / CodePen); Bret Cameron 'Tron Light Cycles' (2020)

Math essence

Per cycle: v in {(1,0),(0,1),(-1,0),(0,-1)}. With prob turn_prob: v <- (v_y, -v_x) or (-v_y, v_x) (90-deg left/right). Integrate position; stamp trail pixel on canvas with high alpha. On collision with non-background pixel or out-of-bounds: cycle dies.

Parameters

Name Type Default Range Description
dim int 512 200–1200 Square arena side length.
num_cycles int 6 1–24 Number of lightcycles.
speed float 1.4 0.5–12 Pixels per tick per cycle.
turn_prob float 0.05 0–0.2 Per-tick probability of random turn.
trail_alpha float 0.92 0.2–1 Trail opacity per stamp.
bg_color tuple 4,6,12 — Background arena color.
seed int null 0–999999

Reference

First 60 lines of reference.py. Full source: library_external/openprocessing_p5js/TronLightcycle/reference.py

from __future__ import annotations

from typing import ClassVar

import numpy as np


class TronLightcycle:
    """Tron-style lightcycle trails on a 2-D arena.

    Each lightcycle moves at a fixed speed along one of four cardinal
    directions (N, E, S, W). On a random tick (or when it is about to crash
    into an existing trail) it turns left or right by 90 degrees, leaving
    behind a glowing tail that all the other cycles must avoid. Crashes
    terminate the offending cycle; surviving cycles continue. This is the
    classic Tron / OpenProcessing "tron-style trails" sketch family
    (cf. <https://codepen.io/BretCameron/pen/PoYERQK> and the various Tron
    forks on openprocessing.org).

    The state is fully deterministic given ``seed`` and ``num_cycles``: a
    cyclic RNG drives both the initial heading distribution and the per-tick
    turn schedule. Trails are stamped onto the canvas each frame with a small
    low-alpha blend so older segments fade slowly.

    ``step(n)`` advances the simulation by n ticks; ``render()`` returns the
    accumulated trail canvas.
    """

    family: ClassVar[str] = "openprocessing_p5js"
    sketch: ClassVar[str] = "tronLightcycle"

    def __init__(
        self,
        dim: int = 512,
        num_cycles: int = 6,
        speed: float = 1.0,
        turn_prob: float = 0.04,
        trail_alpha: float = 0.92,
        bg_color: tuple[int, int, int] = (4, 6, 12),
        palette: tuple[tuple[int, int, int], ...] | None = None,
        seed: int | None = None,
    ) -> None:
        self.dim = dim
        self.num_cycles = num_cycles
        self.speed = speed
        self.turn_prob = turn_prob
        self.trail_alpha = trail_alpha
        self.bg_color = np.array(bg_color, dtype=np.float32)
        if palette is None:
            palette = (
                (255, 32, 64),
                (32, 220, 255),
                (255, 240, 80),
                (160, 80, 255),
                (80, 255, 160),
                (255, 128, 32),
            )
        self.palette = np.array(palette, dtype=np.float32)
        self._seed = seed
        self.reset()

Try running it locally

The reference implementation is self-contained Python with numpy. Install the package and run:

python library_external/openprocessing_p5js/TronLightcycle/reference.py

Need help? See Learn for the standard environment setup, or Playground for an in-browser sketchbook.

More from openprocessing · p5.js

See all openprocessing_p5js artworks →