javascript - 带有雷达循环覆盖的 Google map API v3 绘图，并自动更新雷达

Question

所以我尝试创建一个与 Google Map API v3 混合的雷达循环站点的动态加载

目前，我只是绘制一条从 1 到另一个的线，并希望在缩放 12 处获取天气中心

function initialize() {

var myLatlng = new google.maps.LatLng(34.01115000,-84.27939000);
var mapOptions = {
zoom: 12,
center: new google.maps.LatLng(34.01115000,-84.27939000),
};


var map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);

var flightPlanCoordinates = [
new google.maps.LatLng(34.01115000,-84.27939000),
new google.maps.LatLng(34.03050000,-84.35833000),
];
var flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
geodesic: true,
strokeColor: '#0000FF',
strokeOpacity: 5.8,
strokeWeight: 10,
fillOpacity: 0.35

});

flightPath.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

但在这里我想加载雷达循环并以某种方式更新纬度/经度，但仍然自动移动 map 并调整雷达。

http://radblast.wunderground.com/cgi-bin/radar/WUNIDS_composite?maxlat=34.96496076302826&maxlon=-89.51954101562501&minlat=29.38958076527275&minlon=-98.30860351562501&type=00Q&frame=0&num=7&delay=25&width=800&height=600&png=0&smooth=1&min=0&noclutter=1&rainsnow=1&nodebug=0&theext=.gif&merge=elev&reproj.automerc=1&timelabel=1&timelabel.x=200&timelabel.y=12&brand=wundermap&rand=4564

Answer 1

我可能已经接近

我试图不提供边界并从defaultZoom中获取它们

bounds = new OpenLayers.Bounds(-150.620375523875420, 21.652538062803, -80.517937876818, 50.406626367301044);

defaultLatCenter = 32;
defaultLonCenter = -97;
defaultZoom = 6;

proj4326 = new OpenLayers.Projection("EPSG:4326");
proj900913 = new OpenLayers.Projection("EPSG:900913");

init = function() {
gphy = new OpenLayers.Layer.Google("Google Physical", {

});

osm = new OpenLayers.Layer.OSM("openstreetmap");
map = new OpenLayers.Map("map");
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addLayers([gphy, osm]);
map.setCenter(new OpenLayers.LonLat(defaultLonCenter, defaultLatCenter).transform(proj4326,map.getProjectionObject()), defaultZoom);

bounds = new OpenLayers.Bounds(-150.620375523875420, 21.652538062803, -80.517937876818, 50.406626367301044);
bounds.transform(proj4326, map.getProjectionObject());

var ol_proj;
var g_proj;

ol_proj = new OpenLayers.Projection("EPSG:4326"); 
g_proj = new OpenLayers.Projection("EPSG:900913");

                            var currentbounds;  //OL.Bounds object
                            currentbounds = map.calculateBounds();
                            ol_currentbounds = currentbounds.clone().transform(g_proj,ol_proj);
                            var currentsize;   //OL.Size object
                            currentsize = map.getCurrentSize();
                            var radblastUrl = "http://radblast.wunderground.com/cgi-bin/radar/WUNIDS_composite?" +
                                    "maxlat=" + ol_currentbounds.top +
                                    "&maxlon=" + ol_currentbounds.right +
                                    "&minlat=" + ol_currentbounds.bottom +
                                    "&minlon=" + ol_currentbounds.left +
                                    "&type=N0R&frame=0&num=7&delay=10" +
                                    "&width=" + currentsize.w +
                                    "&height=" + currentsize.h +
                                    "&png=0&smooth=1&min=0&noclutter=0&rainsnow=1&nodebug=0&theext=.gif&merge=elev" +
                                    "&reproj.automerc=1&timelabel=1&timelabel.x=200&timelabel.y=12&brand=wundermap";
                            var radar_overlay2 = new OpenLayers.Layer.Image("Animated Radar", radblastUrl, currentbounds, currentsize, {
                                    opacity: 0.7,
                                    isBaseLayer: false
                            });

 radar_overlay = new OpenLayers.Layer.Image('radar', 'http://radar.weather.gov/ridge/Conus/RadarImg/latest_radaronly.gif', bounds, new OpenLayers.Size(3400, 1600), 



{
'isBaseLayer': false,
'alwaysInRange': true
});

map.addLayer(radar_overlay2);
// map.addLayers([radar_overlay]);                                            
 radar_overlay.setZIndex(150);
 radar_overlay.setOpacity(0.7);
 window.radar_overlay = radar_overlay;





};