mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2025-04-18 08:31:00 +00:00
Code Issues Projects Releases Wiki Activity

Update tile.js

Browse source 
Added the code required to implement virtual images and computed tiles.

The important parts are the call to "this.cacheTile" and the "rendered" handling.

The "rendered" handling makes it possible to modify a tile after it has been loaded.
The starting point is the method "fixTile" (drawer.js), this makes it possible to modify a tile.
For performance reasons it always generates a canvas context, no DOM image.
So the extra "rendered" if-statement is required to detect this.
There is no performance problem, because the image would have been converted to a canvas context anyway.

The "cacheTile" method is used by one or more invisible instances of OpenSeadragon to collect tiles.
These are then processed and accumulated to build the virtual image.
They are stored within the TILE_CACHE and the tileMatrix of the visible instance of OpenSeadragon.
This visible instance is the one which displays the virtual image.
Some changes were required in drawer.js (loadTile) to support this.

The following code is required to force appropriate painting and updating for the virtual image:

        //
        updateDrawer: function ( drawer, tile, target ) {
            try {
                var newtile = drawer.tilesMatrix[tile.level][tile.x][tile.y];
                newtile.image = target;
                newtile.loading = false;
                newtile.loaded = true;
                drawer.updateAgain = true;
                drawer.lastDrawn.push( newtile );
            } catch ( ex ) {
                console.log( ex );
            }
        },

And that method must be called for the viewer and the navigator:

                            mi.updateDrawer( osdMain.drawer, tile, target );
                            mi.updateDrawer( osdMain.navigator.drawer, tile, target );
This commit is contained in:
cskwg 2013-06-10 12:11:37 +03:00
parent affc770b71
commit 25f62cee4b
1 changed files with 21 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
src/tile.js
View file

@ -114,10 +114,7 @@ $.Tile.prototype = {
var containerSize = $.getElementSize( container );
if ( !this.loaded || !this.image ) {
$.console.warn(
"Attempting to draw tile %s when it's not yet loaded.",
this.toString()
);
$.console.warn("Attempting to draw tile " + this.toString() + " when it's not yet loaded.");
return;
}
@ -171,7 +168,7 @@ $.Tile.prototype = {
* @function
* @param {Canvas} context
*/
drawCanvas: function( context ) {
drawCanvas: function (context, tileSource) {
var position = this.position,
size = this.size,
@ -179,10 +176,7 @@ $.Tile.prototype = {
canvas;
if ( !this.loaded || !( this.image || TILE_CACHE[ this.url ] ) ){
$.console.warn(
"Attempting to draw tile %s when it's not yet loaded.",
this.toString()
);
$.console.warn("Attempting to draw tile " + this.toString() + " when it's not yet loaded.");
return;
}
context.globalAlpha = this.opacity;
@ -206,12 +200,21 @@ $.Tile.prototype = {
}
if( !TILE_CACHE[ this.url ] ){
canvas = document.createElement( 'canvas' );
canvas.width = this.image.width;
canvas.height = this.image.height;
rendered = canvas.getContext('2d');
rendered.drawImage( this.image, 0, 0 );
// Is this already a canvas context ?
if ( this.image && this.image.lineTo ) {
rendered = this.image;
} else {
canvas = document.createElement( 'canvas' );
canvas.width = this.image.width;
canvas.height = this.image.height;
rendered = canvas.getContext( '2d' );
rendered.drawImage( this.image, 0, 0 );
}
TILE_CACHE[ this.url ] = rendered;
// give the application the opportunity to cache this tile
if ( this.cacheTile ) {
this.cacheTile( TILE_CACHE, this.url, tileSource, this );
}
//since we are caching the prerendered image on a canvas
//allow the image to not be held in memory
this.image = null;
@ -226,10 +229,10 @@ $.Tile.prototype = {
0,
rendered.canvas.width,
rendered.canvas.height,
position.x,
position.y,
size.x,
size.y
this.position.x,
this.position.y,
this.size.x,
this.size.y
);
//rendered.restore();