Google Maps – My First Map

I have had several attempts at playing with . With playing with Google, I mean use the opportunities that they give people to work/play with their tools and API’s.

Even though the whole copyright and ownership discussions, I still think it is a great chance for people like me to have a go at developing mash-ups of web applications in a fast and easy way. After receiving my eee pc, I started looking into web based applications. Mainly because of the limited storage capacity of the EEE.

I found that there was a lot of them! To be honest, most of the ones I decided to use where Google’s. The main reason to use these was the fact that I can include all, or most of them on the IGoogle page, and have an overview of everything, even with a tiny screen.

When I was looking around, I found that Google Gears offers off-line application access which is really nice.I also stumbled upon something that I would really like, and could not find anywhere. At least in the shape I’d want to use it.

I’m talking about a map here. I “needed” a map, that would center on my position (without GPS) and show me the Barcelona Bicing stations (big public bicycle project here in Barcelona) and bicycle lanes around.

The first issue was solved quickly, I found the Google Lattitude Gadget, which shows me a small map on my iGoogle page. Strangely, most of the times it does not work and when it does, it sometimes freezes my browser. This gadget made me think that geo-location using the wireless signal does work, as most of the times, it pinpoints my position within a 50 m. radius. More than enough for my purpose!

Also I looked at the Geode Add-on for Firefox, providing this functionality. I decided to build a map using that, as the code to write to get a location is extremely easy:

if (navigator.geolocation)
   navigator.geolocation.getCurrentPosition(function(pos){ // position found
        alert( pos.latitude + " -- " + pos.longitude );
      }, function(){ // No position found
        alert( "Error getting your position. Sorry!!");
   });

For the people interested in where that information comes from, have a look at SkyHook, they provide the location data, coming from a huge database with access points, cell phone towers etc.

After a while (I am not a Java-script expert;) playing with the map and the geode location details I managed to build a map that centers on my position.

This however, was not something new, I wanted to give my map a use. So I decided to add a layer on top. I wanted a layer from the Google maps / My Maps to show. I built a map there with markers for my home, work and 3 or 4 other “interesting places”. Strangely enough that was very easy. Even adding a little check box on the page, switching the layer on or off worked fine.

The result was not too spectacular though. A map, showing me a few boring reddish google markers. The plan evolved to make sure I am not re-inventing the wheel (a lot of us tend to do that far too much!).

As explained, I wanted this map to become a handy tool for every Barcelona cyclist. The bicing stands, The bicycle lanes, maybe even specialised shops or beautiful sites, worth a stop or a picture are the minimal I wanted to show.

The to do list evolved to:

• Change the icons. Especially the one that locates me.
• See if it is possible to obtain the xml stream from Bicing, and add all the stations to my map.
• Add info balloons for the Bicing stations, showing information about the free slots, and remaining bicycles.
• Add an overlay with all Barcelona cycling lanes. (you can only find big PDF maps with them, since there are only a few cycling lanes in Barcelona I decided to make my own overlay for that.
• Add an overlay with nice (touristic) cycling routes.

For the moment this is what I am working on in my spare time. Ill keep this blog updated….

work of art in progress

Technorati Tags: Google Maps, Map