Monday, February 11, 2013

Example KML for displaying a photo image from the local disk

Recently I had to generate some Google Earth KML files for displaying photos from a local hard drive in a Placemark balloon. In order to display local images not from a web server, the file keyword must be used with 3 forward slashes in the HTML img tag followed by the full path of the photo file, as shown in the example KML code below.

 <?xml version="1.0" encoding="utf-8"?>  
 <kml>  
  <Document>  
   <name>Example of displaying a local image file</name>  
   <Placemark>  
    <name>Monaco</name>  
    <Snippet>Photo 1</Snippet>  
    <description><![CDATA[  
 <img src='file:///c:\temp\monaco\IMG_5523.jpg' width='400' /><br/&gt;  
 Photo taken from near the palace in Monaco<br/>  
 ]]>  
 </description>  
    <Point>  
     <coordinates>7.421630,43.731459</coordinates>  
    </Point>  
   </Placemark>  
  </Document>  
 </kml>  
The following screenshots show how this KML file is rendered in Google Earth.
 When the Placemark is clicked, the balloon pops up showing the local photo image file.

8 comments:

Howard said...

Wow! Do you think this will work on Google Maps as well?

(PS: thanks for all the coordinate conversion tools you've made involving M'sian RSO systems!)

dominoc925 said...

Thanks Howard but I don't think it will work on Google Maps.

Howard said...

Rats. Oh, well! Thanks! --- Howard

Howard said...

Too bad... oh, well! Cheers! -- Howard

Noor Katikah Sejati said...

i try your code for loading image in html from my disk, but it doesn't work in my web? how i can fix it?

dominoc925 said...

Noor, you need to provide more details. If you like, email me your files at dominoc925 at ymail.com

Unknown said...

Thanks. I'm working on a kmz kml app and this is exactly what I needed.

martyrocks said...

I'm a couple of years late, but this helped a lot, cheers!