OL Image

by seb49

HTML

<html> 
  <head> 
    <script src='http://maps.google.com/maps/api/js?v=3.2&amp;sensor=false' type='text/javascript'></script> 
    <script src='http://openlayers.org/api/OpenLayers.js' type='text/javascript'></script> 
 
  </head> 
 
  <body onload="init()"> 
    <div id="map" style='width: 850px; height: 600px;'></div> 
  </body> 
</html>

JavaScript

init = function() {

defaultLatCenter = 46.893341;
defaultLonCenter = 2.539513;
defaultZoom = 5;
 
proj4326 = new OpenLayers.Projection("EPSG:4326");
proj900913 = new OpenLayers.Projection("EPSG:900913");


  gphy = new OpenLayers.Layer.Google("Google Physical", {
    type: google.maps.MapTypeId.TERRAIN
    });
  osm = new OpenLayers.Layer.OSM("openstreetmap");
  map = new OpenLayers.Map("map");
  map.addControl(new OpenLayers.Control.LayerSwitcher());
  map.addLayers([osm]);
  map.setCenter(new OpenLayers.LonLat(defaultLonCenter, defaultLatCenter).transform(proj4326, map.getProjectionObject()), defaultZoom);
 
var x1 = 52.739645;
var y1 = -5.25555900000001;
var x2 = 41.047037;
var y2 = 10.334585;

var bounds = new OpenLayers.Bounds();

bounds.extend(new OpenLayers.LonLat(y1, x1));
bounds.extend(new OpenLayers.LonLat(y2, x2));
        
bounds.transform(proj4326, map.getProjectionObject());

radar_overlay = new OpenLayers.Layer.Image('radar','http://img15.hostingpics.net/pics/41447420170201110638228.png', bounds, new OpenLayers.Size(0, 0), {
    'isBaseLayer': false,
    'alwaysInRange': true
  });
  map.addLayer(radar_overlay);
  radar_overlay.setZIndex(150);
  radar_overlay.setOpacity(0.7);
  window.radar_overlay = radar_overlay;
  
   var layer_legende = new OpenLayers.Layer.Vector('nomcarte', { displayInLayerSwitcher: true });
   layer_legende.setVisibility(true);
   //layer_legende.styleMap = new OpenLayers.StyleMap(style);
   map.addLayer(layer_legende);
    
    var lonlat = new OpenLayers.LonLat(y1, x1);    
    lonlat = lonlat.transform(proj4326, map.getProjectionObject());    
    var point = new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);        
    var pointFeature = new OpenLayers.Feature.Vector(point, { type: 'text' });    
    layer_legende.addFeatures([pointFeature]);
    
    lonlat = new OpenLayers.LonLat(y2, x2);    
    lonlat = lonlat.transform(proj4326, map.getProjectionObject());    
    var point = new...