Week 9: Mapping

Yahoo pipes offers easy mapping

Using the location extractor module.

This module searches for location related properties inside your RSS feed, like lat, long, country, street, etc. If it finds them, it uses the information inside them to append a location variable to your feed. Using this it then outputs your pipe results on a map. Easy! You can then place this on your page with a pipe badge and voila, you get your results mapped with absolutely minimal coding.

Example using the rss feed from menufeast.com, which contains location information –

http://pipes.yahoo.com/pipes/pipe.info?_id=ed9db1aaba817a18ce4c30e3979fc231

Use this if you are getting results from a Yahoo pipe and then want to map those results straight onto a map.

If you want to do something different to that, google maps and google places offer APIs for you to use.

Google maps and places

To implement google maps, you use javascript.

The google maps allows you to build a map, set its properties, and place it on your page within a div. From here you can do all sorts of things with it.

You can search google places for certain types of things. All of the things you can search for are here –
https://developers.google.com/maps/documentation/places/supported_types

This is handy if you want to search for all local cafes, all local night clubs, etc.
You can easily map these places results onto your google map.

We are basing today’s tut off of this example. Basic google maps place search – http://gis.yohman.com/up206b/4-4/

Completed example

Automatically finding our current location – geolocation

You can find the user’s current location and they search around that particular spot. In the first example this spot by default, is the middle of Santa Monica.

http://aiminstitute.org/blog/2010/07/basic-geolocation-in-html5/

In this example, the success function sets up the map. So to add it to our previous example, we have to turn the initialise function into a success function and include the geolocation code.

Working example with geolocation

Some additional resources:
More Google Maps resources:

Also:

Google alerts http://www.google.com/alerts

Some of you mentioned ‘google’ as a potential data source. Consider this. You can get a google search as a feed. Simply set up your search, and choose ‘Deliver to feed.’ Then press the RSS icon to get the RSS feed of your search. This can get you a feed of regular search results, news, blog entries, videos etc which you can use in a yahoo pipe or what have you.

Notes:

If you use both PHP and javascript inside one file, it must be a .php file. The blocks of PHP code shouldn’t contain javascript, and the blocks of javascript code shouldn’t contain PHP. Remember to keep jQuery code inside a document ready function.

Remember you can use existing pipes other people have already made! Why make more work for yourself? You can also copy pipes and make slight changes.

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