Saturday, November 02, 2024

Map Snake

animated snake moving around a map of London

I'm sure you remember playing the classic game of Snake. This simple yet addictive game required you to maneuver an ever-growing snake while eating pixels and avoiding collisions with the external walls and the snake's own tail. Now, imagine taking that nostalgic gameplay and placing it in the wonderful world of cartography - welcome to Map Snake!

Map Snake takes the cherished arcade experience and enhances it by integrating the gameplay with the interactive maps of major global cities. Now, you must guide your snake through a city landscape, collect markers, and avoid your own tail. This fresh take on a classic game combines the much-loved gameplay of Snake with the unique geography and culture of cities around the world. Get ready to slither your way through an exciting blend of nostalgia and cartography with Map Snake!

I coded Map Snake this morning for the #30DayMapChallenge. Utilizing the powerful MapLibre library, the game animates a linestring on top of OpenFreeMap map tiles. The animated linestring is controlled by keyboard event listeners that follow the player's directions. The game includes a simple collision detection system to determine when the snake interacts with its own tail and utilizes localStorage to keep track of a player's highest score. Each time a new game starts, the map shifts to a random location chosen from an array of seven global cities.

At the moment, the game is very simple, but I have a few ideas for improving the gameplay. For now, I have just one game tip: if your snake moves out of the current map view, don’t panic! Just perform a blind U-turn, and your snake should soon slither back into view.

No comments: