Ahoy! Any respectful adventurer needs a treasure map! And everyone else need a precise map to get from point A to point B. With GPS in every pocket we came to rely on digital maps in our day-to-day lives.
My very first professional project was a map that showed location of trucks in (almost) real-time - but maps aren't limited to logistics. From delivery services to augmented reality games - geo services come in handy.
As you've probably guessed, today I suggest you build a map.
Map: requirements and recipe
As a user I want to see location on the map, so that I can figure out where it is
Here's an example of a pin on a map:
Except this pin is a bit boring - everyone has one just like it - how about something a bit more unique? Like a cross on a treasure map or your favourite icon? Go wild with styling as long as requirements are met.
Requirements
- User should be able to see the pin on every level of zoom
- User should be able to see address or other relevant information by clicking on the pin
- Pin should have sufficient contrast
Recipe
- Choose a spot you'd like to show and get coordinates for it
- Add a map and centre it on those coordinates
- Add a default pin
- Customize pin
- Create a function that would allow you to set both pin and centre to provided location
- Zoom, zoom, zoom and enjoy!
Hints
There are several map solutions out there including open source ones, but the easiest way is to use Google Maps API.
Depending on the shape of your pin you might want to adjust it's "pin" point - it might be the exact middle spot in some cases or something else: e.g. the usual pin has it in the middle of the bottom line of the image.
Hard Mode: Movement and Trail
To honour my humble upbringing I suggest you try and create a map that shows animated location of an object: a trail of your walk, run or, perhaps, something more seasonal, like ski?
With the help of Geolocation API and a bit of geometry you should be able to do that in no time!
Share your creations and feedback and see you tomorrow!
Liked the idea a lot and would love to have it all year long?
Top comments (0)