A few weeks ago, we announced the open source version of MarkerManager, the class used to manage visibility of hundreds of markers on a map, based on the map's current viewport and zoom level. The open-source version has additional functions to delete or clear markers, making it possible to use MarkerManager for a wider variety of applications. In case some of you were wondering how that extra functionality can be useful, I've created a marker-managed easter egg hunt game to show it off.
Try it out below - just press "Start New Game," then click eggs to add them to your basket until you run out of time. Most of the eggs are good (mmm... chocolate filled), but there are some evil (rotten!) eggs in there. As you zoom in, the eggs will be bigger and easier to find, and it will become more obvious which of the eggs are evil and should be avoided.
How does it work?
- First I create a
maxZoomof 19, as I want to make sure that it tracks markers up to my map's highest zoom level (19).
- When the user starts their first game, I generate 45 random points. For each point, I create 3 markers, each with an increasingly larger
GIcon. I add the 3 markers to 3 arrays, representing the 3 zoom levels that display eggs in the hunt. When I'm done creating the marker arrays, I add each array to the
addMarkers function, each with an increasingly higher zoom level (17-19) for the
- When the user clicks on a marker, I use the
removeMarkerfunction to delete the marker at all 3 zoom levels. Back when I created the marker, I extended it to remember it's array index, and because of the way I populated the 3 arrays, the "sister" eggs have the same index in each array. That means it's a simple for loop to delete them at each zoom level.
- If the user wants to play again, I call the
clearMarkersfunction and also clear the 3 arrays I was using to keep references to the markers. Then the egg hiding cycle begins again!
There are also a few extra bits in the code to differentiate between good and bad eggs, timing, and score output. Click here if you'd like to check out the source yourself.
If you're a developer and you're interested in extending MarkerManager or otherwise contributing to our open source library, read the project's FAQ for information on how to join.