# [OpenLayers-Users] How to calculate Bounds for Image Layer Example?

Andreas Hocevar ahocevar at opengeo.org
Tue Jun 23 08:01:12 EDT 2009

```Hi,

On Tue, Jun 23, 2009 at 11:10 AM, Jan Martin<janmartin3 at googlemail.com> wrote:
> I am working from the Image Layer Example:
> http://openlayers.org/dev/examples/image-layer.html
>
> Goal is to switch to an image layer showing a picture (e.g. of a Church).
> I managed to switch from the original map to the image layer using
> map.setBaseLayer(image-layer);

Are you saying that you have a map, and want to switch that to the
image of a church? Ok, why not.

> Problem is how to calculate OpenLayers.Bounds?
> Simply replacing
>    new OpenLayers.Bounds(-180, -88.759, 180, 88.759),
> by
>   new OpenLayers.Bounds(-20037508, -20037508, 20037508, 20037508.34)
> did not work.
> (It just blows up a single pixel to cover the whole map-div.)

The easiest for image layers that do not have to align with a map is
to set the bounds according to the image size. So let's assume you
have an image, like the one in the example, with is 580 pixels wide
and 288 pixels high, then the best approach is to set the bounds to 0,
0, 580, 288.

>
> And even when the example states:
> ..."If you construct it without any resolution related options [Does this
> mean Bounds???], the layer will be given a single resolution based on the
> extent/size."...

This means options like e.g. resolutions, minResolution or maxResolution.

> Commenting out the "new OpenLayers.Bounds( ..." line does not work, it just
> gives an error in both OL 2.7 and 2.8:

The constructor requires at least the name, url, extent and size arguments.

> So how to calculate OpenLayers.Bounds to display the image at its original
> 100% size?

See above.

> Or to fit in the map-div?

Use
new OpenLayers.Size(map.getSize().w, map.getSize().h)
as 4th argument of the layer constructor.

Regards,
Andreas.

>
> Thanks,
> Jan
>
>
> Image Layer Example Code (Cleaned up a bit):
>
> <script type="text/javascript">
>
>
>         var map;
>         function init(){
>             map = new OpenLayers.Map('map');
>
>             var options = {numZoomLevels: 3};
>
>             var graphic = new OpenLayers.Layer.Image(
>                 'City Lights',
>
>
>
> 'http://earthtrends.wri.org/images/maps/4_m_citylights_lg.gif',
>                 new OpenLayers.Bounds(-180, -88.759, 180, 88.759),
>
>
>                 new OpenLayers.Size(580, 288),
>                 options
>             );
>
>             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
>                 "http://t1.hypercube.telascience.org/cgi-bin/landsat7",
>
>
>                 {layers: "landsat7"}, options);
>
>             map.zoomToMaxExtent();
>
>
>         }
>     </script>
>
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
>
>

--
Andreas Hocevar
OpenGeo - http://opengeo.org/
Expert service straight from the developers.

```