Google Maps API Basic Tutorial

© 2006, 2007, 2008, 2009 Mike Williams

 
Translate this page:

 

Links and Images, etc.

You can include links and images in your info windows, and use most HTML formatting commands, as long as you follow a few simple rules:
  1. Use different types of quotes in the HTML from those that you use in Javascript
    Like this '<a href="http://www.econym.demon.co.uk">'
    or like this "<a href='http://www.econym.demon.co.uk'>"
     
  2. When using images, do specify the height and width, otherwise the size of the info window will be calculated incorrectly.
    '<img src="image.jpg" width=150 height=100>'
     
  3. If loading the information from XML, replace '<' and '>' characters with '&lt;' and '&gt;'.
    '&lt;img src="image.jpg" width=150 height=100&gt;'
     
  4. If you want to try writing code that passes W3C Validation, then you need to avoid having the characters "</" in your text. The officially correct way to write "</a>" is to insert a backslash before the forward slash, like "<\/a>".
Here's an example that doesn't use XML.

And here's an example that does. Here's the XML file
Use the "view source" option in your browser to see the XML source. In the main browser display, all the '&lt;' and '&gt;' get displayed as '<' and '>'.

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