Google Maps Time Zone Mashup

This example shows how you can mashup GoMashup data feeds with Google Maps to show the location of a Time Zone location.

 


 

Select a Time Zone Location Bellow...

 

Select Location:

Source Code:



<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
 
    $.getJSON("http://gomashup.com/json.php?fds=geo/timezone/locations&jsoncallback=?", function(data){
      $.each(data.result, function(i,item){
        $("#timezone_list").append("<option value='"+item.TimeZoneId+"'>"+item.TimeZoneId+" (GMT "+item.GMT+")</option>");      
      });
    });
   
    function get_map(location_value)
    {
        document.getElementById("map").innerHTML = "<img alt='Google Map of "+location_value+"' id='google_map' src='http://maps.google.com/maps/api/staticmap?center="+location_value+"&zoom=2&size=400x400&markers=color:blue|label:T|"+location_value+"|&sensor=false' />";
    } 
      
</script>

<form>
    <select id="timezone_list" onChange="get_map(this.value)">
    <option selected value="">Select Location</option>  
    </select>
</form>
<br>
<div id="map">Select Location: </div>