谷歌地图API v3绘图与雷达循环叠加与自动更新雷达

时间:2014-10-11 19:11:00

标签: javascript html google-maps google-maps-api-3 google-api

所以我试图创建一个动态加载到雷达循环网站混合谷歌地图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);

但是在这里我想加载一个雷达回路并以某种方式更新纬度/经度,但仍会自动移动地图并调整雷达。

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

2 个答案:

答案 0 :(得分:0)

我可能会越来越近了

我试图不提供界限并从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;





};

答案 1 :(得分:0)

不确定这是否适用于与Openlayer重叠googlemap。我想尝试坚持googlemap因为知道如何设置标记/线图/信息框,我知道我不知道openlayers

您是否可以使用叠加

添加到图层