https://github.com/roy7077/maze-solver

An interactive maze solver website built with HTML, CSS, and JavaScript, featuring a canvas-based maze creation and solving tool. Draw mazes, find solutions, and customize paths with ease
https://github.com/roy7077/maze-solver

canvas-game css game-development html5 javascript maze-solver

Last synced: about 1 month ago
JSON representation

An interactive maze solver website built with HTML, CSS, and JavaScript, featuring a canvas-based maze creation and solving tool. Draw mazes, find solutions, and customize paths with ease

• Host: GitHub
• URL: https://github.com/roy7077/maze-solver
• Owner: roy7077
• Created: 2023-10-31T14:02:48.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-10-31T14:50:16.000Z (over 2 years ago)
• Last Synced: 2025-06-01T08:34:11.432Z (about 1 year ago)
• Topics: canvas-game, css, game-development, html5, javascript, maze-solver
• Language: JavaScript
• Homepage: https://roy7077.github.io/Maze-solver/
• Size: 698 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Maze Solver Website

## Overview

This is a web-based maze solver application that uses HTML, CSS, JavaScript, and the HTML5 `` element to provide an interactive experience for solving mazes. Users can draw and solve mazes on the canvas, and the application provides a pathfinding algorithm to find the solution to the maze.

![maze_solver](https://github.com/roy7077/Maze-solver/assets/107414907/2dcb2945-a3f6-451a-b6b1-69390984883b)

## Features

- **Maze Creation:** Users can draw mazes on the canvas using their mouse or touch input.

- **Maze Solving:** The application provides a built-in maze-solving algorithm that finds the shortest path from the start to the end of the maze.

- **Interactive Interface:** Users can start, reset, and clear mazes. They can also customize the maze by selecting different start and end points.

## Technologies Used

- **HTML:** The structure of the website is defined using HTML.

- **CSS:** The styling and layout of the website are controlled using CSS for a visually appealing user interface.

- **JavaScript:** The core functionality and interactivity are implemented using JavaScript. This includes maze generation, solving, and user interactions.

- **Canvas Element:** The `` HTML5 element is used for rendering the maze, providing interactivity, and visualizing the solution.

## Getting Started

To run this application locally or on your server:

1. Clone the repository to your local machine: git clone https://github.com/roy7077/Maze-solver.git

2. Open the `index.html` file in your web browser.

## Usage

1. Draw a maze on the canvas by clicking and dragging the mouse.

2. Click the "Solve Maze" button to find the solution.

3. Customize the maze by changing the start and end points, or reset the maze as needed.

## Contributing

If you would like to contribute to this project, please follow these steps:

1. Fork the repository.

2. Create a new branch for your feature: `git checkout -b feature-name`.

3. Make your changes and commit them: `git commit -m 'Add new feature'`.

4. Push to your fork: `git push origin feature-name`.

5. Create a pull request.

**Happy Maze Solving!**