/snake-game

Primary LanguageJavaScript

html-canvas-snake-game

Using Html5 Canvas and Basic Graphics Algorithms.

Algorithms that have been used in this project:

  1. Line draw - Bressenham line drawing algorithm
  2. Circle draw - Bressenham circle drawing algorithm
  3. Filling - 4 connected Flood-fill algorithm

Implementation:

  1. Snake size increased by one every time it eats food.
  2. Snake can only change direction at a right angle;
  3. Snake move is controlled by arrow-key(left, right, up, down).
  4. It's not possible to change the direction to the opposite direction;
  5. Game will be over if the snake touches itself.
  6. When the snake crosses the grid boundary, it reappears from the opposite direction.
  7. Grid cell will be filled with color when clicked.
  8. New food will appear in every 3s/4s.

Initial screen

Initial screen


After eating four foods

After eating four foods


After clicking some cell(filling grid cell)

color-cell


To run this project just clone this repo and open the index.html file in the browser.

Thanks.