Zyring Day 9 – more maps…

[Note: These are more in-depth (read: tedious) write-ups of my experience with each section of the Zyring project, leading on from my intro post on Zyring. This is mostly for my own benefit but could conceivably be of use to someone doing the project.]

Adding pins to Google Maps

Another straightforward one that does what it says on the tin, though I needed to view the example here to work out exactly how to do it. Now I have some markers on the map!

Map of Seattle with markers to show apartment locations

Markers showing apartment locations

The current map settings aren’t ideal, though, because Tacoma and Olympia are off the map. For now I just zoom out a bit (zoom level 8 instead of 10). Now the Olympia markers are visible:

Zoomed out to show Olympia

Zoomed out to show Olympia

Add overlays to your pin

This time I’m adding windows that pop up when a marker is clicked on, with some information like a picture of the apartment and the price. This uses the ui-gmap-windows directive and is again pretty simple to set up.

Map with pop-up description showing a photo and the price of each apartment

Now with pop-up descriptions

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s