Modified the batch creation code and the batch drawing code to only insert degenerate triangles at the end of rows or when a row is broken (e.g. by some empty tiles which we won't draw at all). This should speed things up by optimising the draw, and reducing the amount of data required to describe the batch.

PIXI.Tilemap - _renderBatch using a local 'degenerate' flag to signal to next iteration that one should be inserted before the next triangle.
Phaser.TilemapLayerGL - add degenerate markers at end of rows and whenever a row has a break in it (e.g. empty tiles)
Phaser.Tileset - new addDegenerate function which prevents double markers in a row
This commit is contained in:
Pete Baron 2016-06-27 18:24:56 +12:00
parent 626d0cf64f
commit 9e3a7ec537
4 changed files with 33 additions and 4 deletions

View file

@ -188,3 +188,6 @@ Added alpha blending based on TilemapLayerGL.alpha property. NOTE: this appears
Prepared code to pass each Tile alpha value through to the batch renderer, however realised that implementing this will break the batching!
Need to talk with Rich about it before proceeding further.
Modified the batch creation code and the batch drawing code to only insert degenerate triangles at the end of rows or when a row is broken (e.g. by some empty tiles which we won't draw at all). This should speed things up by optimising the draw, and reducing the amount of data required to describe the batch.

View file

@ -191,6 +191,7 @@ PIXI.Tilemap.prototype._renderBatch = function( renderSession )
// process entire glBatch into a single webGl draw buffer for a TRIANGLE_STRIP blit
var c = 0;
var degenerate = false;
for(var i = 0, l = this.glBatch.length; i < l; i++)
{
// sx: this.drawCoords[coordIndex],
@ -203,6 +204,13 @@ PIXI.Tilemap.prototype._renderBatch = function( renderSession )
// dh: this.tileHeight
var t = this.glBatch[i];
if ( !t )
{
// insert a degenerate triangle when null is found in the list of batch objects
degenerate = true;
continue;
}
var x = t.dx * iWide - 1;
var y = 1 - t.dy * iHigh;
@ -212,9 +220,8 @@ PIXI.Tilemap.prototype._renderBatch = function( renderSession )
var uvl = t.sx * iTextureWide;
var uvt = t.sy * iTextureHigh;
// for every tile except the first one, use degenerate triangle to separate the tiles
// TODO: it might be possible to avoid this by drawing triangles more intelligently (e.g. each row with inverting the first/second triangle alternately)
if ( c > 0 )
// insert a degenerate triangle to separate the tiles
if ( degenerate )
{
// add a degenerate triangle: repeat the last vertex
buffer[ c ] = oldR;
@ -228,6 +235,7 @@ PIXI.Tilemap.prototype._renderBatch = function( renderSession )
// advance the buffer index
c += 8;
degenerate = false;
}
// calculate the destination location of the tile in screen units (-1..1)

View file

@ -645,7 +645,7 @@ Phaser.TilemapLayerGL.prototype.renderRegion = function (scrollX, scrollY, left,
var tw = this._mc.tileWidth;
var th = this._mc.tileHeight;
var lastAlpha = NaN;
// var lastAlpha = NaN;
offx = offx || 0;
offy = offy || 0;
@ -699,6 +699,8 @@ Phaser.TilemapLayerGL.prototype.renderRegion = function (scrollX, scrollY, left,
if (!tile || tile.index < 0)
{
// skipping some tiles, add a degenerate marker into the batch list
this._mc.tileset.addDegenerate( this.glBatch );
continue;
}
@ -742,6 +744,8 @@ Phaser.TilemapLayerGL.prototype.renderRegion = function (scrollX, scrollY, left,
}
// at end of each row, add a degenerate marker into the batch list
this._mc.tileset.addDegenerate( this.glBatch );
}
};

View file

@ -189,6 +189,20 @@ Phaser.Tileset.prototype = {
},
/**
* adds a marker for the batch display to insert a degenerate triangle (eg. at the end of each row of tiles)
*
* @param {[type]} glBatch [description]
*/
addDegenerate: function( glBatch )
{
// don't insert multiple degenerate markers in a row
if ( glBatch[ glBatch.length - 1] )
{
glBatch.push( null );
}
},
/**
* Returns true if and only if this tileset contains the given tile index.
*