Wilson’s Algorithm IV

100%

Wilson’s Algorithm IV

✓ Published0🌍 Public

Last edited Feb 9, 2016

Created on May 12, 2014

Wilson’s Algorithm IV applies D3’s tree layout to a maze generated by Wilson’s loop-erased random walk. The maze is represented as a hierarchical tree of connected cells, with SVG paths drawn as straight links between parent and child nodes. The code uses `d3.layout.tree`, `tree.nodes`, and `tree.links` to compute positions, while custom functions `generateMaze` and `generateTree` construct the maze’s spanning tree. The visualization shows the resulting tree structure with black connecting lines against a white background, using D3 v3 and SVG rendering.

AI-generated description

Applying a tree layout on Wilson’s algorithm.

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Wilson’s Algorithm

Wilson’s Algorithm visualizes the construction of a uniform spanning tree via loop-erased random walks on a black canvas. A magenta path grows until it connects to the existing white maze, with loops erased and reconnecting cells turned white. The animation uses a Canvas context with `fillRect` for cells and corridors, managed by `d3.timer`, `d3.range`, and the `globalCompositeOperation` property for path erasure. Starting from one cell, the process accelerates as the maze expands, revealing the tree’s structure.

Mmbostock

88% match

Loading thumbnail…

Wilson’s Algorithm II

A maze generated by Wilson’s algorithm is flooded with color, where hue encodes the Manhattan distance from the starting cell. The black-and-white maze structure is too noisy for comparison, so the color helps reveal overall maze shape and differences between algorithms. The visualization uses D3 v3 and a Canvas context, animating the flood via `d3.timer`, `fillRect`, and `d3.hsl` to tint each cell as the frontier expands. The maze is built procedurally with loop-erased random walks.

Mmbostock

86% match

Loading thumbnail…

Wilson’s Algorithm III

This piece uses Wilson’s algorithm to generate a spanning tree of a canvas, then floods it with color so that hue encodes Manhattan distance from the root. The animation is rendered as a Canvas image using `d3.timer` and `context.putImageData`, with the maze generation offloaded to a worker thread. The code relies on D3’s `d3.select` and `d3.hsl` for styling and color, while the generated tree is visualized in a web page with a “wait” message.

Mmbostock

84% match

Loading thumbnail…

Maze Tree

A maze, generated as a uniform spanning tree via Wilson’s algorithm, is drawn on a black canvas. The tree layout repositions each maze cell from its grid coordinates into a Reingold–Tilford tree, animating the transition over 2.5 seconds with d3 transitions and tweens. The code uses d3.layout.tree, d3.timer, and the Canvas 2D API to redraw links each frame, with nodes sorted by depth.

Mmbostock

79% match

Loading thumbnail…

Random Search II

A maze generated with Wilson’s algorithm is solved through random search. The gray frontier cells expand in random order, while the magenta path highlights the current best-scoring route toward the goal. The visualization uses D3 v3 and Canvas 2D drawing, with a timer running ten random frontier explorations per frame. Cell scores are computed as squared Euclidean distance to the goal, and the animation stops when the goal cell is reached.

Mmbostock

78% match

Loading thumbnail…

Randomized Depth-First IV

A maze is generated on a 40x40 grid using a randomized depth-first traversal, then converted into a tree structure. The tree layout from D3 is applied to position the nodes, and SVG paths draw the links between parent and child nodes. The code uses `d3.layout.tree`, `d3.select`, and SVG path elements to render the final hierarchical visualization. The tree’s branching pattern visually reflects the maze’s corridors and dead ends, with each node representing a cell and each link a passage.

Mmbostock

77% match

Loading thumbnail…

Random Traversal IV

This example shows a tree layout applied to a recursively generated maze, producing a branching structure of connected cells. The maze is created using a randomized depth-first traversal that records edge connections, and the resulting tree is rendered as a set of black link paths. The code uses `d3.layout.tree` to compute node positions from the maze’s traversal tree, then draws each link as an SVG path with `M` and `L` commands. The visualization is built with D3 v3 and SVG, with the maze generation logic implemented in plain JavaScript.

Mmbostock

76% match

Loading thumbnail…

Best-First Search II

Best-first search solves a maze generated with Wilson’s algorithm, animating the exploration on a black canvas. The solver expands cells in order of Euclidean distance to the goal, highlighting the current best path in magenta while marking visited cells. The maze is drawn cell-by-cell using Canvas 2D `fillRect` calls, with the frontier managed by a custom binary heap. The animation steps through ten frontier expansions per frame via `d3.timer`, and the path is traced by backtracking through parent pointers.

Mmbostock

75% match