installing google api key
Posted: Wed 20 Aug 2014 6:37 am
hi all I am trying to install the weather map temps from google api key but sean to be not loading can someone help me out please 
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
<meta name="description" content="<#location> weather data" />
<meta name="keywords" content="Cumulus, <#location> weather data, weather, maps, weather station" />
<title><#location> weather</title>
<link href="weatherstyle.css" rel="stylesheet" type="text/css" />
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDhSQkoziqQ6_MRogbq1RAdJMjwkqcDHvo"type="text/javascript"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=weather"></script>
<style type="text/css">
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script>
function initialize() {
var mapOptions = {
zoom: 6,
center: new google.maps.LatLng(30.0000,-140.0000)
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var weatherLayer = new google.maps.weather.WeatherLayer({
temperatureUnits: google.maps.weather.TemperatureUnit.FAHRENHEIT
});
weatherLayer.setMap(map);
var cloudLayer = new google.maps.weather.CloudLayer();
cloudLayer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="content">
<h1><#location> weather</h1>
<h2 style="text-align: left; text-transform: none;" >
Latitude <#latitude> Longitude <#longitude> Elevation <#altitude></h2>
<!--Start of Radar -->
<table >
<table align="centre"cellspacing="2" cellpadding="2" width="812" border="0">
<caption>Weather Watch Radar<br/><font size="2" color ="White"> Click Radar Map to view full size. Click again to close.</font></caption><tr align="center">
<td width="320" >
<!-- start of Google Maps Stuff -->
<div id="map-canvas"></div>
<!-- end Google Maps Stuff -->
<br>
<a href="http://mirror.bom.gov.au/products/IDR733.loop.shtml"><img src="http://mirror.bom.gov.au/radar/IDR733.gif" ALT="Townsville local radar image" width="150" height="150" border="0"></a><br>
128km <a href="http://mirror.bom.gov.au/products/IDR733.shtml">Static</a> | <a href="http://mirror.bom.gov.au/products/IDR733.loop.shtml?looping=1&reloaded=0&topography=true&locations=true&wthrDistricts=true#skip">40 Min Loop</a> | <a href="http://radar.strikeone.net.au/?fuseaction=loops.main&radar=733&numberofImages=18&dateStart=0&dateFinish=0">3 Hr Loop</a><br>
256km <a href="http://mirror.bom.gov.au/products/IDR732.shtml">Static</a> | <a href="http://mirror.bom.gov.au/products/IDR732.loop.shtml?looping=1&reloaded=0&topography=true&locations=true&wthrDistricts=true#skip">40 Min Loop</a> | <a href="http://radar.strikeone.net.au/?fuseaction=loops.main&radar=732&numberofImages=18&dateStart=0&dateFinish=0">3 Hr Loop</a><br>
512km <a href="http://mirror.bom.gov.au/products/IDR731.shtml">Static</a> | <a href="http://mirror.bom.gov.au/products/IDR731.loop.shtml?looping=1&reloaded=0&topography=true&locations=true&wthrDistricts=true#skip">40 Min Loop</a> | <a href="http://radar.strikeone.net.au/?fuseaction=loops.main&radar=731&numberofImages=18&dateStart=0&dateFinish=0">3 Hr Loop</a><br>
</td>
</tr>
</table>
<!-- End Of Radar -->
<!-- Almanac -->
<table width="100%" border="0" cellpadding="10">
<tbody><tr>
<td class="labels">Dawn:</td>
<td class="site_data" style="text-align: left;"><#dawn></td>
<td class="labels">Sunrise:</td>
<td class="site_data" style="text-align: left;"><#sunrise></td>
<td class="labels">Moonrise:</td>
<td class="site_data" style="text-align: left;"><#moonrise></td>
<td rowspan="3"><img src="images/moon.bmp" alt="Moon" width="64" align="left" border="0" height="64" style="margin: 0px 10px" /></td>
</tr>
<tr>
<td class="labels">Dusk:</td>
<td class="site_data" style="text-align: left;"><#dusk></td>
<td class="labels">Sunset: </td>
<td class="site_data" style="text-align: left;"><#sunset></td>
<td class="labels">Moonset:</td>
<td class="site_data" style="text-align: left;"><#moonset></td>
</tr>
<tr>
<td class="labels">Daylight:</td>
<td class="site_data" style="text-align: left;"><#daylightlength></td>
<td class="labels">Day length:</td>
<td class="site_data" style="text-align: left;"><#daylength></td>
<td class="labels">Moon Phase:</td>
<td class="site_data" style="text-align: left;"><#moonphase></td>
</tr>
</tbody></table>
<!-- END Almanac -->
<p>Welcome to <#longlocation>. </p>
<p>The weather station in use is the <#stationtype>, and these pages are updated
every <#interval> minutes. The meteorological day used at this station ends at
<#rollovertime>.</p>
<p>Forecast: <#forecast></p>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<caption>Conditions at local time <#time></caption>
<tr>
<td colspan="4" class="tableseparator_temp">Temperature and Humidity </td>
</tr>
<tr class="td_temperature_data">
<td>Temperature</td>
<td><#temp> <#tempunit></td>
<td>Dew Point </td>
<td><#dew> <#tempunit></td>
</tr>
<tr class="td_temperature_data">
<td>Windchill</td>
<td><#wchill> <#tempunit></td>
<td>Humidity</td>
<td><#hum>%</td>
</tr>
<tr class="td_temperature_data">
<td>Heat Index</td>
<td><#heatindex> <#tempunit></td>
<td>Apparent Temperature</td>
<td><#apptemp> <#tempunit></td>
</tr>
<!-- Solar data. If you don't have a solar sensor, you may wish to delete everything from here to the next comment -->
<tr class="td_temperature_data">
<td>Solar Radiation</td>
<td><#SolarRad> W/m²</td>
<td>Evapotranspiration Today</td>
<td><#ET> <#rainunit></td>
</tr>
<!-- End of solar data -->
<tr>
<td colspan="4" class="tableseparator_rainfall">Rainfall</td>
</tr>
<tr class="td_rainfall_data">
<td>Rainfall Today</td>
<td><#rfall> <#rainunit></td>
<td>Rainfall Rate</td>
<td><#rrate> <#rainunit>/hr</td>
</tr>
<tr class="td_rainfall_data">
<td>Rainfall This Month</td>
<td><#rmonth> <#rainunit></td>
<td>Rainfall This Year</td>
<td><#ryear> <#rainunit></td>
</tr>
<tr class="td_rainfall_data">
<td>Rainfall Last Hour</td>
<td><#rhour> <#rainunit></td>
<td>Last rainfall</td>
<td><#LastRainTipISO></td>
</tr>
<tr>
<td colspan="4" class="tableseparator_wind">Wind</td>
</tr>
<tr class="td_wind_data">
<td>Wind Speed (gust)</td>
<td><#wgust> <#windunit></td>
<td>Wind Speed (avg)</td>
<td><#wspeed> <#windunit></td>
</tr>
<tr class="td_wind_data">
<td>Wind Bearing</td>
<td><#avgbearing>° <#wdir></td>
<td>Beaufort <#beaufort></td>
<td><#beaudesc></td>
</tr>
<tr>
<td colspan="4" class="tableseparator_pressure">Pressure</td>
</tr>
<tr class="td_pressure_data">
<td>Barometer </td>
<td><#press> <#pressunit></td>
<td><#presstrend></td>
<td><#presstrendval> <#pressunit>/hr</td>
</tr>
<tr>
<td colspan="4" class="td_navigation_bar">:<a href="index.htm">Home</a>::<a href="#">forecast<a/>::<a href="gauges.htm">gauges</a>::<a href="today.htm">today</a>::<a href="charts&maps.htm">charts & maps</a>::<a href="#">windmaps</a>::<a href="yesterday.htm">yesterday</a>::<a href="thismonth.htm">this month</a>::<a href="thisyear.htm">this year</a>::<a href="record.htm">history</a>::<a href="monthlyrecord.htm">monthly records</a>::<a href="NOAA-reports.php">reports</a>::<a href="trends.htm">trends</a>::<#webcam></td>
</tr>
</table>
<!-- Start of Footer -->
<table align="centre" summary="weather networks Logos" style="margin: 0 auto; padding: 20px 0px">
<tr>
<td><a href="http://www.pwsweather.com/"><img src="images/logo_pws.png" alt="Personnal Weather Stations" title="Personnal Weather Stations" /></a></td>
<td><a href="http://www.wunderground.com/cgi-bin/findweather/getForecast?brand=wxmap&zoom=11&query=Townsville%2CQueensland" target="_blank"><img src="Googlemap.gif" width="96" height="96"alt="WU" border=0></td>
<td><a href="http://wow.metoffice.gov.uk/home"><img src="images/WOW.png" alt="Weather Observations Website" title="Weather Observations Website" /></a></td>
<td><a href="http://wxqa.com/"><img src="images/logo_cwop.png" alt="Citizen Weather Observer Program" title="Citizen Weather Observer Program" /></a></td>
<td><a href="http://www.aprs.org/"><img src="images/logo_aprs.png" alt="Automatic Packet Reporting System " title="Automatic Packet Reporting System " /></a></td>
<td><a href="http://weather.weatherbug.com/"><img src="images/logo_weatherbug.png" alt="WeatherBug" title="WeatherBug" /></a></td>
</tr>
</table>
</table>
<!-- End Of Footer -->
<p class="credits"><br />
Page updated <#update><br />
powered by
<a href="http://sandaysoft.com/products/cumulus" target="_blank">Cumulus</a>
v<#version> (<#build>)
</p>
</div>
</body>
</html>