what does Google My Maps do?

The service to be launched in the UK, US, Italy, Germany, France, Canada, Spain, Netherlands, Australia and Japan offers users the ability to add markers (selected from a library), photos, YouTube videos and more.

The maps once created can then be listed for public viewing or unlisted so as to keep it private or just allowing friend’s access.

can’t you do this already?

To date such features have only been available to those that know how to develop using the Google Maps API. I myself have dabbled with the API and found it to be fairly simple to implement, however, this latest product is sure to be a hit with many people around the world and may be helping to push social networking to a new level.

I’m sure we will see this as a feature on many MySpace/Facebook pages in the very near future.

As yet the product has only been launched in Australia and can be found on the Google Maps Australia home page.

the hacks

Phew.  Right now I’ve got that out of the way lets start off with one of the most commonly used hacks, the underscore hack.

_width:100%;

This will work in all IE browsers below IE 7 but NOT IE 7 itself.

Next we move onto the backslash hack.

w\idth:100%;

This will work in most browsers (Firefox 2 and 1.5, IE 7 and 6, Opera) however it is not recognised in IE 5.5 and 5.

Then the star hack.

*width:100%;

This works in all versions of IE but not other browsers.

combinations

Right now we have some of the main hacks listed we can now start to combine them to good effect.

Lets combine underscore hack and the backslash hack.

_w\idth:50%;

This will work in IE 6 only;

Now lets combine the star hack and the backslash hack.

*w\idth:50%;

This will work in IE 7 and 6.

Now lets adopt a slightly different method of combing using the star hack and the underscore hack as follows.

*width:50%;
_width:inherit;

This will only target IE 7 with regards to applying the 50%.

demo

Check out this simple IE CSS Hacks demo to see the results.  All the columns that are set to a width of 50% have the style applied.

In search of the solution

Having crawled the internet for a good while a came across the following article Emad Fanous.  This article details an API that has been developed to return geocoded addresses, postcodes etc.

This solution provided everything I required, does exactly what it says on the tin and is easy to implement to boot.  Now I did come across postcode lists like jibble for example, however, I felt that the API would provide a more complete solution (In the sense of data available) and was more interesting to use :-).

the code

The code is very simple and is as follows:

function gmap_geocode_postcode(postcode){
  var s = document.createElement(’script’);
  s.src = ‘http://geo.localsearchmaps.com/?cb=gmap_map_postcode&use=google2&country=uk&zip=’ + postcode;
  s.type = ‘text/javascript’;
  document.getElementsByTagName(’head’)[0].appendChild(s);
}

function gmap_map_postcode(lon, lat){
  map.setCenter(new GLatLng(lon, lat), 13);
}

Here’s an example of the Geocoding for UK postcodes in action.

scalability

Now I wouldn’t say this solution will be massively scaleable, however, if you just require a simple address search and you do not believe it will be heavily used then this would be a good solution for you.

update

I have recently stumbled upon a payed for service called iShareMaps on Demand.  The service (for a small fee of around £423 a year) offers a scalable UK Geocoding service that may be usefull if anyone wishes to use geocoding on a high traffic site.

This is another nice touch and undoubtedly adding to Googles world domination plans (if only in a very small way), however, it is still a worth while look.

See the full article here:

• Google adds traffic flow reports but there is a better way.