Google Maps API Tutorial

Instant maps with the Google Wizard

Here's an example

Maps generated by the Wizard only show a single marker, and you don't get any control over the contents of the info window.

The generated map will also have a Google AJAX Search API box, and direction finding (in a new maps.google.com window)

You don't even have to sign up for an API key. The Wizard creates its own key for your domain.

Restrictions

The Wizard only works for locations that can be found with the Google AJAX Search API. So street addresses in Andorra, Australia, Canada, France, Germany, Italy, Netherlands, New Zealand, Spain, and United States of America are OK, and UK Post Codes are OK. Outside those countries it will only recognise the names of cities. It won't work with latitude and longitude coordinates, it always needs a text address that it can look up wuth AJAX Search.

How to use it

1. Go to the Wizard page and follow the three simple steps.

2. Copy and paste the generated code into your own web page.

   Cut the code into two pieces. The bit that looks something like this can be placed anywhere on your page

     <div id="mapsearch">
       <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span>
     </div>

   The rest of the code should be placed just before the </body> at the bottom of your page.

3. Double-click your page to test it, then upload it to your website.

You can make some minor changes to the behaviour and style of the map by studying the GSmapSearchControl documentation.

Back to Mike's Homepage
Up to the start of this tutorial