[GIS] Using OpenLayers to display image only

imageryopenlayers-2

I have a high resolution image, which I've broken down into tiles and named the tiles according to x,y co-ordinates and zoom levels. The image is not projected in any geospatial/gis (WGS84 ellipsoid, spherical mercator) ellipsoid.

If it is possible to use OpenLayers (version 2.x) to display the image in the browser, then how should I go about doing that?

Note that I also want to be able to overlay the image with other data, and OL allows me to do this easily on a map but not entirely sure if I can do this with an image.

Best Answer

Yes, you can show tile image in browser by following code:

var Layer = new OpenLayers.Layer.TMS("map", "", {'type':'png', 'getURL':get_my_url,isBaseLayer:true});

and get_my_url function is:

function get_my_url(bounds) {

var res = this.map.getResolution();
if (url instanceof Array) {
    url = this.selectUrl(path, url);
}
var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));
var y = Math.round((this.maxExtent.top - bounds.top) / (res * this.tileSize.h));

var z = this.map.getZoom();
var path = z + "_" + x + "_" + y + "." + this.type;
var url = this.url;

return url + path;

}

I hope it can help you.