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

Add gutter support to ol.renderer.webgl.TileLayer

Browse Source
This commit is contained in:
Éric Lemoine
2013-12-10 16:58:45 +01:00
parent 5c71ec4922
commit 701b2d63ef
2 changed files with 64 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/ol/renderer/webgl/webglmaprenderer.js
View File

@@ -75,6 +75,26 @@ ol.renderer.webgl.Map = function(container, map) {
this.canvas_.className = ol.css.CLASS_UNSELECTABLE;
goog.dom.insertChildAt(container, this.canvas_, 0);
/**
* @private
* @type {HTMLCanvasElement}
*/
this.clipTileCanvas_ = /** @type {HTMLCanvasElement} */
(goog.dom.createElement(goog.dom.TagName.CANVAS));
/**
* @private
* @type {ol.Size}
*/
this.clipTileCanvasSize_ = [0, 0];
/**
* @private
* @type {CanvasRenderingContext2D}
*/
this.clipTileContext_ = /** @type {CanvasRenderingContext2D} */
(this.clipTileCanvas_.getContext('2d'));
/**
* @private
* @type {boolean}
@@ -184,9 +204,14 @@ ol.renderer.webgl.Map = function(container, map) {
function(map, frameState) {
if (!this.tileTextureQueue_.isEmpty()) {
this.tileTextureQueue_.reprioritize();
var tile =
/** @type {ol.Tile} */ (this.tileTextureQueue_.dequeue()[0]);
this.bindTileTexture(tile, goog.webgl.LINEAR, goog.webgl.LINEAR);
var element = this.tileTextureQueue_.dequeue();
var tile = /** @type {ol.Tile} */ (element[0]);
var tileWidth = /** @type {number} */ (element[3]);
var tileHeight = /** @type {number} */ (element[4]);
var tileGutter = /** @type {number} */ (element[5]);
this.bindTileTexture(tile,
tileWidth, tileHeight, tileGutter,
goog.webgl.LINEAR, goog.webgl.LINEAR);
}
}, this);
@@ -245,11 +270,14 @@ ol.renderer.webgl.Map.prototype.bindBuffer = function(target, buf) {
/**
* @param {ol.Tile} tile Tile.
* @param {number} tileWidth Tile width.
* @param {number} tileHeight Tile height.
* @param {number} tileGutter Tile gutter.
* @param {number} magFilter Mag filter.
* @param {number} minFilter Min filter.
*/
ol.renderer.webgl.Map.prototype.bindTileTexture =
function(tile, magFilter, minFilter) {
function(tile, tileWidth, tileHeight, tileGutter, magFilter, minFilter) {
var gl = this.getGL();
var tileKey = tile.getKey();
if (this.textureCache_.containsKey(tileKey)) {
@@ -268,8 +296,29 @@ ol.renderer.webgl.Map.prototype.bindTileTexture =
} else {
var texture = gl.createTexture();
gl.bindTexture(goog.webgl.TEXTURE_2D, texture);
gl.texImage2D(goog.webgl.TEXTURE_2D, 0, goog.webgl.RGBA, goog.webgl.RGBA,
goog.webgl.UNSIGNED_BYTE, tile.getImage());
if (tileGutter > 0) {
var clipTileCanvas = this.clipTileCanvas_;
var clipTileCanvasSize = this.clipTileCanvasSize_;
var clipTileContext = this.clipTileContext_;
if (clipTileCanvasSize[0] != tileWidth ||
clipTileCanvasSize[1] != tileHeight) {
clipTileCanvas.width = tileWidth;
clipTileCanvas.height = tileHeight;
clipTileCanvasSize[0] = tileWidth;
clipTileCanvasSize[1] = tileHeight;
} else {
clipTileContext.clearRect(0, 0, tileWidth, tileHeight);
}
clipTileContext.drawImage(tile.getImage(), tileGutter, tileGutter,
tileWidth, tileHeight, 0, 0, tileWidth, tileHeight);
gl.texImage2D(goog.webgl.TEXTURE_2D, 0,
goog.webgl.RGBA, goog.webgl.RGBA,
goog.webgl.UNSIGNED_BYTE, clipTileCanvas);
} else {
gl.texImage2D(goog.webgl.TEXTURE_2D, 0,
goog.webgl.RGBA, goog.webgl.RGBA,
goog.webgl.UNSIGNED_BYTE, tile.getImage());
}
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_MAG_FILTER, magFilter);
gl.texParameteri(