Add HiDPI support to ol.renderer.webgl.TileLayer

This commit is contained in:
Tom Payne
2014-01-15 13:02:16 +01:00
parent 0c42d04295
commit 977f5cf5b2

View File

@@ -114,7 +114,6 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
var context = mapRenderer.getContext(); var context = mapRenderer.getContext();
var gl = mapRenderer.getGL(); var gl = mapRenderer.getGL();
var pixelRatio = frameState.pixelRatio;
var view2DState = frameState.view2DState; var view2DState = frameState.view2DState;
var projection = view2DState.projection; var projection = view2DState.projection;
@@ -126,7 +125,10 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
var z = tileGrid.getZForResolution(view2DState.resolution); var z = tileGrid.getZForResolution(view2DState.resolution);
var tileResolution = tileGrid.getResolution(z); var tileResolution = tileGrid.getResolution(z);
var tileSize = tileGrid.getTileSize(z); var tilePixelSize =
tileSource.getTilePixelSize(z, frameState.pixelRatio, projection);
var pixelRatio = tilePixelSize / tileGrid.getTileSize(z);
var tilePixelResolution = tileResolution / pixelRatio;
var tileGutter = tileSource.getGutter(); var tileGutter = tileSource.getGutter();
var center = view2DState.center; var center = view2DState.center;
@@ -150,13 +152,13 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
var tileRangeSize = tileRange.getSize(); var tileRangeSize = tileRange.getSize();
var maxDimension = var maxDimension = Math.max(
Math.max(tileRangeSize[0] * tileSize, tileRangeSize[1] * tileSize); tileRangeSize[0] * tilePixelSize, tileRangeSize[1] * tilePixelSize);
var framebufferDimension = ol.math.roundUpToPowerOfTwo(maxDimension); var framebufferDimension = ol.math.roundUpToPowerOfTwo(maxDimension);
var framebufferExtentDimension = tileResolution * framebufferDimension; var framebufferExtentDimension = tilePixelResolution * framebufferDimension;
var origin = tileGrid.getOrigin(z); var origin = tileGrid.getOrigin(z);
var minX = origin[0] + tileRange.minX * tileSize * tileResolution; var minX = origin[0] + tileRange.minX * tilePixelSize * tilePixelResolution;
var minY = origin[1] + tileRange.minY * tileSize * tileResolution; var minY = origin[1] + tileRange.minY * tilePixelSize * tilePixelResolution;
framebufferExtent = [ framebufferExtent = [
minX, minY, minX, minY,
minX + framebufferExtentDimension, minY + framebufferExtentDimension minX + framebufferExtentDimension, minY + framebufferExtentDimension
@@ -252,8 +254,8 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
framebufferExtentDimension - 1; framebufferExtentDimension - 1;
goog.vec.Vec4.setFromValues(u_tileOffset, sx, sy, tx, ty); goog.vec.Vec4.setFromValues(u_tileOffset, sx, sy, tx, ty);
gl.uniform4fv(this.locations_.u_tileOffset, u_tileOffset); gl.uniform4fv(this.locations_.u_tileOffset, u_tileOffset);
mapRenderer.bindTileTexture(tile, tileSize, tileGutter, mapRenderer.bindTileTexture(tile, tilePixelSize,
goog.webgl.LINEAR, goog.webgl.LINEAR); tileGutter * pixelRatio, goog.webgl.LINEAR, goog.webgl.LINEAR);
gl.drawArrays(goog.webgl.TRIANGLE_STRIP, 0, 4); gl.drawArrays(goog.webgl.TRIANGLE_STRIP, 0, 4);
} }
} }
@@ -287,7 +289,7 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
tile, tile,
tileGrid.getTileCoordCenter(tile.tileCoord), tileGrid.getTileCoordCenter(tile.tileCoord),
tileGrid.getResolution(tile.tileCoord.z), tileGrid.getResolution(tile.tileCoord.z),
tileSize, tileGutter tilePixelSize, tileGutter * pixelRatio
]); ]);
} }
}, this); }, this);