A* Pathfinding Visualization

Interactive visualization of the A* pathfinding algorithm with obstacle avoidance using visibility graphs. Draw walls, set start and goal positions, and watch the algorithm find the optimal path.

How to Use

Keyboard Shortcuts:

  • W - Wall drawing mode
  • S - Set start node
  • G - Set goal node
  • Enter - Build graph and find path
  • C - Clear canvas

Instructions:

  1. Press W and click/drag to draw walls (obstacles)
  2. Press S and click to place the start node (green)
  3. Press G and click to place the goal node (red)
  4. Press Enter to build the visibility graph (red lines)
  5. Press Enter again to run A* pathfinding
  6. Watch the optimal path appear in lime green
  7. Press C to clear and start over

Instructions:

  • 1. Draw walls by clicking and dragging (or press W for wall mode)
  • 2. Place start node (green) by pressing S and clicking
  • 3. Place goal node (blue) by pressing G and clicking
  • 4. Press Enter or click "Build Graph" to create visibility graph (red lines)
  • 5. Press Enter again or click "Find Path" to run A* pathfinding
  • 6. The lime path shows the shortest route avoiding obstacles
  • 7. Press C to clear and start over

Debug Log:

No logs yet...

About the Algorithm

This visualization uses the A* pathfinding algorithm combined with visibility graphs for obstacle avoidance. The algorithm works in two phases:

  1. Visibility Graph Construction: Creates nodes at obstacle corners and connects nodes that have line-of-sight to each other (red lines).
  2. A* Search: Finds the shortest path from start to goal using a heuristic function (Euclidean distance) to guide the search efficiently.