Google Tools Training Hub for EDAW & MWCT

Introductory Slides

Technique Tour

Files & Data for Practicing

1. HTML code for embedding images in balloons:

<img src = "http://upload.wikimedia.org/wikipedia/commons/c/c6/Kilimanjaro_%28paulshaffner%29.jpg">

2. HTML code for more balloon design:

<table width="500" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#0066FF">&nbsp;</td>
    <td bgcolor="#FF0000">&nbsp;</td>
    <td bgcolor="#FFCC00">&nbsp;</td>
    <td bgcolor="#00CC00">&nbsp;</td>
  </tr>
</table>
<p><img src="http://images.google.com/intl/en/logos/Logo_50wht.gif" alt="google" align="left" /><br />  
<font face="Arial, Helvetica, sans-serif" size="3"><b><i><a href="http://www.google.com">Google's</a> main campus is<br />
located in Mountain View, CA.</i></b></font></p>
<p>&nbsp;</p>
<p><img src="http://farm3.static.flickr.com/2195/1565442229_f8bef1a951.jpg" alt="pic" /></p>
<table width="500" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#0066FF">&nbsp;</td>
    <td bgcolor="#FF0000">&nbsp;</td>
    <td bgcolor="#FFCC00">&nbsp;</td>
    <td bgcolor="#00CC00">&nbsp;</td>
  </tr>
</table>

3. Website to retrieve HTML embed code for YouTube video: 

http://www.youtube.com/watch?v=11t8rT7_rUw&feature=related

4. Image Overlay:
Mount Kilimanjaro contours from WikiCommons - 

5. Photo Overlay:
Mount Kilimanjaro photo from WikiMedia - 

6. HTML code for embedding charts and visualizations:

Chart (line graph):
<img src = "http://chart.apis.google.com/chart?chtt=Percent+Grassland&cht=lc&chs=400x250&
chd=t:25,28,30,22,23,24,39,34,42,31,27,30,47,73,112,113,80,78,81,75,92,90,105,79,107,103,114,130,135,
138,137,142,143,171,213,279,328,340,341,335,337,306,308,276,238,234,199,192,194,181,180,205,223,231,232&
chds=0,400&chco=66cc66&chxt=x,y&chxl=0:|2004|2005|2006|2007|2008|2009|1:||25%|50%|75%|100%&chm=B,ccffcc,0,0,0">

Visualization (timeline):
<iframe width="750" height="260" src="http://karinoutreach.googlepages.com/timeline.html"> </iframe>

For more practice, use the Interactive KML Samples

Use the Embed KML Gadget to easily embed your Google Earth projects in your webpage or blog.


Workshop Guide: Download PDF file part 1 & part 2

Questions

Q: What is KML?
A: KML stands for Keyhole Markup Language, the language that Google Earth understands.  Just like a web browsers understands and displays HTML, Google Earth understands and displays KML.  Whenever you create a placemark or anything else in Google Earth, you are automatically creating KML!  To actually see KML, do the "copy-and-paste trick" -- copy anything (placemark, polygon, etc.) in your My Places or Temporary Places, and paste it into a text editor (e.g. Notepad) to see the KML that is used to create data in Google Earth.

Q
A

Important Websites

Google Earth examples
These Google Earth KML files can be opened and explored using Google Earth (download here, if necessary).
All of the following examples, as well as many others, can be found at the Google Earth Outreach Showcase or the Google Earth Gallery.

Google Maps examples
These Google Maps examples can be visited and explored using any Internet browser, such as Mozilla Firefox, Google Chrome, or Internet Explorer. They are 2-dimensional applications using Google Maps API.
Google Earth Plug-in for the Browser examples
These Google Earth Plug-in examples can be visited and explored using any Internet browser, such as Mozilla Firefox or Internet Explorer. They are 3-dimensional applications using Google Earth API.



Subpages (1): Notes & Discussion
Ċ
Earth Outreach,
Mar 20, 2009, 7:49 AM
ċ
Land_Cover_in_Southeast_Asia.zip
(530k)
Earth Outreach,
Mar 20, 2009, 7:17 AM
ċ
Technique_Tour.kmz
(19k)
Earth Outreach,
Mar 20, 2009, 7:48 AM
ċ
mtbullgpx.gpx
(2978k)
Earth Outreach,
Mar 20, 2009, 7:16 AM
Comments