Danny,
I am trying to get this working in HTML and on my intranet. No external web server just my own at home. I followed your instructions but cannot get the radar to over-lay the map. I was supprised that Google would give me the api on a private IP address but it works.
I'm sure that I am missing something very rookie, if you wouldn't mind taking a look to stear me in the right directions?
<head>
<title>Google Nexrad Doppler Radar</title>
<meta name="description" content="test" />
<meta name="keywords" content="test" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-store"/>
<meta name="distribution" content="global"/>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true_or_false&key=ABQIAAAA5uvpvJ9Bxm21XdVeHbEt4xRfWanLLCphprUHhM3Ro32oaDF9qBTSMXrFhTLwkPutwslNRrrNIDsOng" type="text/javascript"></script>
</script>
<script src="http://192.168.1.10/current/misc/google-maps/gsp/radar.js"></script>
<script src="http://192.168.1.10/current/misc/google-maps/gsp/ridge.js"></script>
<script type="text/javascript">
var Clock ;
var Cycle ;
var Google;
var Helper;
var Last= 0;
var Skew= 0;
var Wrap= 10;
var Idle=100;
var Back=500;
var Radar=[];
var Ridge=["GSP"];
var Product=["NCR","RAX"];
function Pause(pause)
{
Idle=pause*10;
Back=pause*50;
}
function Opacity(opacity)
{
for (var i=0;Ridge[i];i++)
{
Radar[i].opacity(opacity);
}
}
function Loop()
{
for (var i=0;Ridge[i];i++)
{
Helper.childNodes[i].childNodes[0].data=Radar[i].select(Last);
}
Last=(Last+1)%Wrap;
Clock=clearTimeout(Clock);
Clock=setTimeout("Loop()",Last ? Idle : Back);
}
function Feed()
{
var stub="http://www.srh.noaa.gov/ridge2/JSON_generator.php?callback=CallBack&frames="+Wrap;
for (var i=0;Ridge[i];i++)
{
Radar[i].feed(stub+"&rid="+Ridge[i]+"&product="+Product);
}
Cycle=clearTimeout(Cycle);
Cycle=setTimeout("Feed()",150000);
}
function CallBack(callback)
{
var stub="http://www.srh.noaa.gov/";
var pair;
var reload=[];
for (var i=0;callback.directory[i];i++)
{
pair=callback.directory[i].match(/([A-Z][A-Z][A-Z]|[A-Z][0-9][A-Z])/g);
reload[i]=stub+callback.directory[i];
}
for (var i=0;Ridge[i];i++)
{
if (pair) if (pair[0]==Product) if (pair[1]==Ridge[i]) Radar[i].reload(reload);
}
}
function Load()
{
Google=document.getElementById("google");
Google.style.width ="640px";
Google.style.height="640px";
GDraggableObject.setDraggableCursor("pointer");
GDraggableObject.setDraggingCursor ("pointer");
Google=new GMap2(Google);
Google.setCenter (new GLatLng(35.273,-80.777),7, G_NORMAL_MAP);
Google.setUIToDefault();
Helper=document.getElementById("helper");
for (var i=0;Ridge[i];i++)
{
Helper.appendChild(document.createElement("DIV"));
Helper.childNodes[i].appendChild(document.createTextNode(""));
Radar[i]=new FrameAnimationLayerOverlay({bbox:BBox(Ridge[i],Product),size:{x:640,y:640},last:Last,skew:Skew,wrap:Wrap,name:Ridge[i]+"_"+Product});
Google.addOverlay(Radar[i]);
}
Feed();
Loop();
}
function Free()
{
GUnload();
}
</script>
</head>
<body onload="Load();" onunload="Free();">
<div style="font-family:arial; font-size:13px; font-weight:normal;" align="center">
<div id="google"></div>
<div id="helper"></div>
<div>
<input type="radio" name="pause" onclick="Pause( 5);"> Extra Fast
<input type="radio" name="pause" onclick="Pause( 8);"> Fast
<input type="radio" name="pause" onclick="Pause(12);"> Medium
<input type="radio" name="pause" onclick="Pause(18);"> Slow
<input type="radio" name="pause" onclick="Pause(25);"> Extra Slow
<input type="radio" name="pause" onclick="Pause( 2000);"> Pause
</div>
<div>Opacity
<input type="radio" name="opacity" onclick="Opacity(0.25);"> 25%
<input type="radio" name="opacity" onclick="Opacity(0.50);"> 50%
<input type="radio" name="opacity" onclick="Opacity(0.75);"> 75%
<input type="radio" name="opacity" onclick="Opacity(1.00);"> 100%
</div>
<br/><br/><br/>
</div>
</body>
</html>
Thanks,
Marshall