ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

#632: fixing the image layer that broke with r2979 - layer now sets its tileSize and imageSize appropriately - this also addesses (dup) ticket 511

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@3020 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
Tim Schaub
2007-04-05 22:35:54 +00:00
parent 1de25d5f04
commit cd6f2dd006
3 changed files with 55 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
examples/image-layer.html
View File

@@ -13,10 +13,11 @@
<script src="../lib/OpenLayers.js"></script>
<script type="text/javascript">
<!--
var map;
function init(){
var map = new OpenLayers.Map('map');
map = new OpenLayers.Map('map');
var options = {maxResolution: 'auto', numZoomLevels: 3};
var options = {numZoomLevels: 3};
var graphic = new OpenLayers.Layer.Image(
'City Lights',

51
lib/OpenLayers/Layer/Image.js
View File

@@ -24,17 +24,23 @@ OpenLayers.Layer.Image.prototype =
/** @type String */
url: null,
/** @type OpenLayers.Bounds */
/**
* The image bounds in map units
* @type OpenLayers.Bounds
*/
extent: null,
/** @type OpenLayers.Size */
/**
* The image size in pixels
* @type OpenLayers.Size
*/
size: null,
/** @type OpenLayers.Tile.Image */
tile: null,
/** The ratio of height/width represented by a single pixel in the graphic
*
/**
* The ratio of height/width represented by a single pixel in the graphic
* @type Float */
aspectRatio: null,
@@ -94,10 +100,16 @@ OpenLayers.Layer.Image.prototype =
* @param {OpenLayers.Map} map
*/
setMap: function(map) {
// If nothing to do with resolutions has been set, assume a single
// resolution determined by extent/size
/**
* If nothing to do with resolutions has been set, assume a single
* resolution determined by ratio*extent/size - if an image has a
* pixel aspect ratio different than one (as calculated above), the
* image will be stretched in one dimension only.
*/
if( this.options.maxResolution == null ) {
this.options.maxResolution = this.extent.getWidth() / this.size.w;
this.options.maxResolution = this.aspectRatio *
this.extent.getWidth() /
this.size.w;
}
OpenLayers.Layer.prototype.setMap.apply(this, arguments);
},
@@ -116,11 +128,8 @@ OpenLayers.Layer.Image.prototype =
if(zoomChanged || firstRendering) {
//determine new tile size
var tileWidth = this.extent.getWidth() / this.map.getResolution();
var tileHeight = this.extent.getHeight() /
(this.map.getResolution() * this.aspectRatio);
var tileSize = new OpenLayers.Size(tileWidth, tileHeight);
this.setTileSize();
//determine new position (upper left corner of new bounds)
var ul = new OpenLayers.LonLat(this.extent.left, this.extent.top);
var ulPx = this.map.getLayerPxFromLonLat(ul);
@@ -128,16 +137,28 @@ OpenLayers.Layer.Image.prototype =
if(firstRendering) {
//create the new tile
this.tile = new OpenLayers.Tile.Image(this, ulPx, this.extent,
this.url, tileSize);
this.url, this.tileSize);
} else {
//just resize the tile and set it's new position
this.tile.size = tileSize.clone();
this.tile.size = this.tileSize.clone();
this.tile.position = ulPx.clone();
}
this.tile.draw();
}
},
/**
* Set the tile size based on the map size. This also sets layer.imageSize
* and layer.imageOffset for use by Tile.Image.
*/
setTileSize: function() {
var tileWidth = this.extent.getWidth() / this.map.getResolution();
var tileHeight = this.extent.getHeight() / this.map.getResolution();
this.tileSize = new OpenLayers.Size(tileWidth, tileHeight);
this.imageSize = this.tileSize;
this.imageOffset = new OpenLayers.Pixel(0, 0);
},
/**
* @param {String} newUrl
*/

20
tests/Layer/test_Image.html
View File

@@ -18,7 +18,7 @@
t.eq( layer.name, "Test Layer", "layer.name is correct" );
t.ok( layer.id != null, "Layer is given an id");
t.ok( layer.projection, "none", "default layer projection correctly set");
t.eq( layer.projection, "none", "default layer projection correctly set");
t.ok( ((layer.chicken == 151) && (layer.foo == "bar")), "layer.options correctly set to Layer Object" );
t.ok( ((layer.options["chicken"] == 151) && (layer.options["foo"] == "bar")), "layer.options correctly backed up" );
@@ -39,7 +39,7 @@
}
function test_50_Layer_Image_tileTests (t) {
t.plan(4);
t.plan(9);
var map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.Image('Test Layer',
@@ -49,8 +49,20 @@
map.addLayer(layer);
map.zoomToMaxExtent();
t.eq(layer.tile.position.x,-40, "Tile x positioned correctly at maxextent");
t.eq(layer.tile.position.y,107, "Tile y positioned correctly at maxextent");
t.ok(layer.imageSize, "layer.imageSize is set");
t.ok(layer.tileSize, "layer.tileSize is set");
t.ok(layer.tileSize.equals(layer.imageSize), "tileSize equals imageSize");
// no resolution info was sent, so maxResolution should be calculated
// by aspectRatio*extent/size (this is the pixel aspect ratio)
var aspectRatio = (layer.extent.getHeight() / layer.size.h) /
(layer.extent.getWidth() / layer.size.w);
t.eq(aspectRatio, layer.aspectRatio, "aspectRatio is properly set");
var maxExtent = aspectRatio * layer.extent.getWidth() / layer.size.w;
t.eq(maxExtent, layer.maxResolution, "maxResolution is properly set");
t.eq(layer.tile.position.x,-42, "Tile x positioned correctly at maxextent");
t.eq(layer.tile.position.y,106, "Tile y positioned correctly at maxextent");
t.eq(layer.tile.imgDiv.src, "http://earthtrends.wri.org/images/maps/4_m_citylights_lg.gif", "URL is correct");
map.zoomIn();
t.eq(layer.tile.imgDiv.src, "http://earthtrends.wri.org/images/maps/4_m_citylights_lg.gif", "URL is correct");