Best-First Search

100%

Best-First Search

✓ Published0🌍 Public

Last edited Feb 26, 2019

Created on Apr 22, 2014

A maze appears as a grid of white cells on a black background, with a single magenta path tracing the solution. Best-first search expands the maze from the bottom-right corner, prioritizing cells closest to the top-left goal by Euclidean distance, filling explored cells in gray. A binary min-heap manages the frontier, and the path is redrawn as the search narrows. The maze itself is generated via random traversal, rendered using Canvas 2D fillRect calls within a d3.timer animation loop.

AI-generated description

This maze is generated using random traversal, and then solved using best-first search. Compare to random search. See best-first search on a maze generated using Wilson’s algorithm.

gpl-3.0 Licensed

Similar vizzes

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

89% match

Loading thumbnail…

Better-Only Search

A maze is generated using random traversal, then solved with “better-only search,” a best-first search variant restricted to north and east moves. The canvas renders the maze as a white grid on black, with gray fill marking explored cells and magenta highlighting the current best path. The solver uses a min-heap frontier and animation via d3.timer, updating ten cells per tick to show the search progression toward the goal.

Mmbostock

87% match

Loading thumbnail…

Random Search

This visualization animates a random search algorithm solving a maze, which was itself generated via random traversal. A magenta path highlights the best-known route from the top-right corner to the bottom-left, updating as the search progresses. The code uses D3 v3's timer API to drive the animation and a Canvas context for all drawing. The underlying maze and search logic are implemented directly with JavaScript arrays and bitwise operations to represent cell connections.

Mmbostock

82% 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

A randomized depth-first traversal generates a maze on a black canvas, with the active frontier of possible extensions highlighted in magenta. The algorithm starts in the bottom-left corner and repeatedly pops a frontier edge, carving passages in random directions while ensuring no cycles form. It renders to a 2D canvas using `d3.v3` and a `d3.timer` loop, drawing cells and corridors as white rectangles and spacing gaps. Each step redraws affected cells and frontier edges, with a shuffle applied to the frontier array to randomize the next choice.

Mmbostock

76% match

Loading thumbnail…

Random Traversal

A black canvas displays a maze being generated cell by cell via a random traversal algorithm. White cells mark the growing maze structure, while magenta highlights the current frontier of possible extensions. The animation progresses in steps, using the Canvas API to draw rectangles for cells and connections. The code implements the algorithm with a frontier array and popRandom selection, using d3.v3's timer for animation control.

Mmbostock

75% match

Loading thumbnail…

Maze Hover

A maze rendered on a Canvas element fills the viewport, with a red path tracing the route from the top-left cell to the current mouse position. As the pointer moves over the grid of cells, the highlighted path updates dynamically, always showing the unique parent-child connection from the hovered cell back to the starting corner. The code uses D3 v3’s `d3.select` and `d3.mouse` to handle pointer events, while `generateMaze` builds the maze with a loop-erased random walk and `computeParents` derives each cell’s predecessor for path reconstruction. The black background and white maze structure are drawn with `fillRect`, with the red overlay repainted on every `mousemove`.

Mmbostock

75% match

Loading thumbnail…

Randomized Depth-First II

A maze is generated using randomized depth-first traversal, then flooded with color to reveal its structure. Hue encodes the Manhattan distance from the starting cell, making the maze’s branching patterns visually comparable. The animation is rendered on a Canvas 2D context, drawing cells and passages incrementally as the flood expands. The code uses D3’s `d3.timer` to drive the animation loop and `d3.hsl` to cycle hue over time, while a custom `generateMaze` function builds the maze and `fillRect` calls paint each cell and connecting corridor.

Mmbostock

75% match