Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am trying to overlay a jpg image over an openlayers map. I have been to the example on their site and looked all over for a solution with no luck. So I am guessing that their are rules for setting an openlayers.layer.image as an overlay layer. I have tried jpg, png, gif. They all work fine as a base layer with the following code:

var image_layer = new OpenLayers.Layer.Image( 'Wallpaper', 'images.png', new 
OpenLayers.Bounds(-90,-45,90,45), new OpenLayers.Size(318,159), {numZoomLevels:7,
maxResolution:.625} );

But once I include:

var image_layer = new OpenLayers.Layer.Image( 'Wallpaper', 'images.png', new 
OpenLayers.Bounds(-90,-45,90,45), new OpenLayers.Size(318,159), {numZoomLevels:7, 
maxResolution:.625, **isBaseLayer: false**} );

the layer is grey out within the layer switcher

I did figure out that if I include 2 different image layers - I can specify the second as an overlay. However, once I add a WMS, that overlay greys out!

What am I doing wrong - or better yet - what is openlayer doing wrong?


share|improve this question
this is my code..... and its not displaying in openlayers....please help var graphic = new OpenLayers.Layer.Image( 'sample img', 'localhost:8080/haryana:yam2.tif';, // 'localhost:8080/geoserver/wcs';, //{layers:'haryana:yam2.geotiff'}, new OpenLayers.Bounds(-180, -88.759, 180, 88.759), new OpenLayers.Size(50, 28), {numZoomLevels:5} ); – user15058 Feb 11 '13 at 7:25

I use the following code:

  graphic = new OpenLayers.Layer.Image(
            new  OpenLayers.Bounds(20.008697509767,32.076110839844,20.123138427735,32.154235839844),
            new OpenLayers.Size(750, 512),
            { isBaseLayer: false,
              opacity: 0.3,
              displayOutsideMaxExtent: true

and it works fine. I assume you do have a base layer of some sort in your map and that you've added it too the map before the image layer?

share|improve this answer

i have tried two image overlay and didnt get any error. you can look at this jsfiddle here...

beside this you can check out Mapstraction Image Overlay method here for getting some idea.

i.e code:

 radar_overlay = mapObject.addImageOverlay('radar', '
 /Conus/RadarImg/latest_radaronly.gif', 100, -127.620375523875420, 21.652538062803, 
 -66.517937876818, 50.406626367301044);

an example with Mapstraction here..

i hope it helps you...

share|improve this answer

When you use image layer, the image is displayed only when you zoom to that extent where the image height and width can fit the bounds of the image. When that happens the check boxes will be enabled, else those will be disabled.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.