Google Earth 5, World Time Zone Clock - Javascript and KML
February 5th, 2009
Here’s a KML and Javascript(!) hack for the new Google Earth 5.
It overlays a time zone map and allows you to click anywhere on the globe to see a running clock with the current time for that location.
Grab the KML file here:
This uses normal KML to display a balloon when a polygon is clicked. Each balloon description has its own bit of Javascript to automatically calculate and display the time for the associated time zone.
More Info
In addition to running javascript, this hooks into a couple of other implementation changes in the new GE 5.
- Polygons are now directly clickable. Previously you had to click on them in combination with a key press to make their description bubbles appear.
- Stylemap highlight styles are triggered by mouseovers on polygons and lines instead of just placemark icons.
The polygons in this file are drawn from Valery’s KML Timezone map, posted on the Keyhole BBS a few years ago.
Related posts:
- KML ZIP Scribble Map
- UK and Ireland Flight Maps
- #uksnow Twitter Animation - Google Earth 5
- When two satellites collide, in Google Earth
- Google Earth 5.0

Hi
There is an error in you KML file
tesselate is mispelled and should be spelled tessellate.
Other than that, thanks for excellent work. Just what I needed
Pål, thanks for the debug. It’s fixed now.
This is great! Thank you, I’ve long wished something like this was available, and now it is
If you want, you can embed this addon on Ge Plugin:
http://www.videomap.it/kml/videomap.kmz
6000 and plus geotagged videos from Videomap community
city place of interest nature etc..
Hi i have a problem!!
I have put your javascript-code in one “KML Interactive exsample” from google:
http://kml-samples.googlecode.com/svn/trunk/interactive/index.html
I modify the Polygons-Absolute Example.
I put this Block:
<![CDATA[
var int=self.setInterval("tick()",50);
function tick(){
document.getElementById("clock").innerHTML=calc(-12);
}
function calc(offset) {
d = new Date();
utc = d.getTime() + (d.getTimezoneOffset() * 60000);
nd = new Date(utc + (3600000*offset));
return nd.toLocaleString();
}
]]>
in the Placemark:
Absolute test
<![CDATA[
var int=self.setInterval("tick()",50);
function tick(){
document.getElementById("clock").innerHTML=calc(-12);
}
function calc(offset) {
d = new Date();
utc = d.getTime() + (d.getTimezoneOffset() * 60000);
nd = new Date(utc + (3600000*offset));
return nd.toLocaleString();
}
]]>
1
#transBluePoly
absolute
-112.3372510731295,36.14888505105317,1784
-112.3356128688403,36.14781540589019,1784
-112.3368169371048,36.14658677734382,1784
-112.3384408457543,36.14762778914076,1784
-112.3372510731295,36.14888505105317,1784
1
but it dosnt work.
wat do i wrong?
@Doctore - Nothing. Unfortunately it’s just a security restriction in the browser plugin. By default Javascript is blocked from running in balloons. I don’t think there’s a workaround for the KML sampler
If you’re writing your own plug-in application, you can get a round the problem with this technique:
http://earth-api-samples.googlecode.com/svn/trunk/examples/balloon-youtube.html
but if i call yuor “World Clock”.kml - script, it works.
Fantastic, I needed it desperately as I work with different places around the world. Can you display the name of city/state/country on the pointer. Sorry if I am asking for too much
you spoilt. Its a very good utility you made. Keep up the good work. Cheers!
@Anshul - Thanks! Adding stuff to the mouse pointer isn’t possible in GE, unfortunately.
Times in Barnaul Russia are off an hour???
Is there no way to adjust the base clock??? I see there is an issue with daylight savings time…. it says 8:00 when it’s 9:00 here. Anyway to change this? Nothing in properties.
yeah, I also noticed that the time is 1 hour off. I checked and according to the Internet, it’s 14.05 at the East Coast (New York) but your kml file shows me it’s 13.05. And I know, 14.05 is correct, because the NASCAR Race at Bristol, Tn (same timezone as NY) starts right now, and the starting time is set for 14.05 not 13.05. My local time here in Germany is 19.05
However: I know, in the USA, they already use summer time since 2 weeks. In Germany, summer time starts next weekend, so maybe that is the reason why there is this 1 hour delay.
But let me tell you: I am really glad that I found your site, I have been searching for a world clock since quite some time.
Ok, so in the meantime, summer time is also here in Germany (since 1 week) but still, it doesn’t work correct.
I just checked and my computer clock says it’s 18.57, but when I click on my location in GE, it says the time is 17.57.
So, is the time setting not based on the local computer time ?
It’s incorrect: Krasnoyarsk and Novosibirsk in the real world have different zones. But on this map - single zone.
Thanks it’s very useful.
You can also use http://www.worldtimeengine.com to get the current time around the world and see the time differences.
Hi,
I work on Adobe Flex 3.0 and I do not understand how to use the KML file. Also, can this be used with google maps?
For those interested in having google implement *real* timezone support in the google calendar please visit here and add your voice:
http://www.google.com/support/forum/p/Calendar/thread?tid=659883e8e50d4fd8&hl=en
OK,It works fine, but how do I get the overlay to go away? Thanks.