mirror of
https://github.com/openseadragon/openseadragon.git
synced 2024-11-24 22:26:10 +03:00
Added scaling to drawer.
This commit is contained in:
Ian Gilman
parent
ea6ee54136
commit
a3973a25e7
@ -222,6 +222,13 @@ module.exports = function(grunt) {
|
||||
"uglify", "replace:cleanPaths", "copy:build"
|
||||
]);
|
||||
|
||||
// ----------
|
||||
// Minimal build task.
|
||||
// For use during development as desired.
|
||||
grunt.registerTask("minbuild", [
|
||||
"git-describe", "concat", "copy:build"
|
||||
]);
|
||||
|
||||
// ----------
|
||||
// Test task.
|
||||
// Builds and runs unit tests.
|
||||
|
||||
@ -76,6 +76,7 @@ $.Drawer = function( options ) {
|
||||
|
||||
x: 0,
|
||||
y: 0,
|
||||
scale: 1,
|
||||
|
||||
//internal state properties
|
||||
viewer: null,
|
||||
@ -131,6 +132,10 @@ $.Drawer = function( options ) {
|
||||
this.context = this.useCanvas ? this.canvas.getContext( "2d" ) : null;
|
||||
// Ratio of zoomable image height to width.
|
||||
this.normHeight = this.source.dimensions.y / this.source.dimensions.x;
|
||||
|
||||
this.worldWidth = this.scale;
|
||||
this.worldHeight = this.normHeight * this.scale;
|
||||
|
||||
/**
|
||||
* @member {Element} element
|
||||
* @memberof OpenSeadragon.Drawer#
|
||||
@ -360,7 +365,7 @@ function updateViewport( drawer ) {
|
||||
zeroRatioC = drawer.viewport.deltaPixelsFromPoints(
|
||||
drawer.source.getPixelRatio( 0 ),
|
||||
true
|
||||
).x,
|
||||
).x * drawer.scale,
|
||||
lowestLevel = Math.max(
|
||||
drawer.source.minLevel,
|
||||
Math.floor(
|
||||
@ -414,22 +419,22 @@ function updateViewport( drawer ) {
|
||||
|
||||
//Don't draw if completely outside of the viewport
|
||||
if ( !drawer.wrapHorizontal &&
|
||||
( viewportBR.x < 0 || viewportTL.x > 1 ) ) {
|
||||
( viewportBR.x < 0 || viewportTL.x > drawer.worldWidth ) ) {
|
||||
return;
|
||||
} else if
|
||||
( !drawer.wrapVertical &&
|
||||
( viewportBR.y < 0 || viewportTL.y > drawer.normHeight ) ) {
|
||||
( viewportBR.y < 0 || viewportTL.y > drawer.worldHeight ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Calculate viewport rect / bounds
|
||||
if ( !drawer.wrapHorizontal ) {
|
||||
viewportTL.x = Math.max( viewportTL.x, 0 );
|
||||
viewportBR.x = Math.min( viewportBR.x, 1 );
|
||||
viewportBR.x = Math.min( viewportBR.x, drawer.worldWidth );
|
||||
}
|
||||
if ( !drawer.wrapVertical ) {
|
||||
viewportTL.y = Math.max( viewportTL.y, 0 );
|
||||
viewportBR.y = Math.min( viewportBR.y, drawer.normHeight );
|
||||
viewportBR.y = Math.min( viewportBR.y, drawer.worldHeight );
|
||||
}
|
||||
|
||||
// Calculations for the interval of levels to draw
|
||||
@ -446,7 +451,7 @@ function updateViewport( drawer ) {
|
||||
renderPixelRatioC = drawer.viewport.deltaPixelsFromPoints(
|
||||
drawer.source.getPixelRatio( level ),
|
||||
true
|
||||
).x;
|
||||
).x * drawer.scale;
|
||||
|
||||
if ( ( !haveDrawn && renderPixelRatioC >= drawer.minPixelRatio ) ||
|
||||
( level == lowestLevel ) ) {
|
||||
@ -460,7 +465,7 @@ function updateViewport( drawer ) {
|
||||
renderPixelRatioT = drawer.viewport.deltaPixelsFromPoints(
|
||||
drawer.source.getPixelRatio( level ),
|
||||
false
|
||||
).x;
|
||||
).x * drawer.scale;
|
||||
|
||||
zeroRatioT = drawer.viewport.deltaPixelsFromPoints(
|
||||
drawer.source.getPixelRatio(
|
||||
@ -470,7 +475,7 @@ function updateViewport( drawer ) {
|
||||
)
|
||||
),
|
||||
false
|
||||
).x;
|
||||
).x * drawer.scale;
|
||||
|
||||
optimalRatio = drawer.immediateRender ?
|
||||
1 :
|
||||
@ -556,8 +561,8 @@ function updateLevel( drawer, haveDrawn, drawLevel, level, levelOpacity, levelVi
|
||||
}
|
||||
|
||||
//OK, a new drawing so do your calculations
|
||||
tileTL = drawer.source.getTileAtPoint( level, viewportTL );
|
||||
tileBR = drawer.source.getTileAtPoint( level, viewportBR );
|
||||
tileTL = drawer.source.getTileAtPoint( level, viewportTL.divide( drawer.scale ));
|
||||
tileBR = drawer.source.getTileAtPoint( level, viewportBR.divide( drawer.scale ));
|
||||
numberOfTiles = drawer.source.getNumTiles( level );
|
||||
|
||||
resetCoverage( drawer.coverage, level );
|
||||
@ -601,7 +606,8 @@ function updateTile( drawer, drawLevel, haveDrawn, x, y, level, levelOpacity, le
|
||||
drawer.tilesMatrix,
|
||||
currentTime,
|
||||
numberOfTiles,
|
||||
drawer.normHeight
|
||||
drawer.worldWidth,
|
||||
drawer.worldHeight
|
||||
),
|
||||
drawTile = drawLevel;
|
||||
|
||||
@ -671,7 +677,7 @@ function updateTile( drawer, drawLevel, haveDrawn, x, y, level, levelOpacity, le
|
||||
return best;
|
||||
}
|
||||
|
||||
function getTile( x, y, level, tileSource, tilesMatrix, time, numTiles, normHeight ) {
|
||||
function getTile( x, y, level, tileSource, tilesMatrix, time, numTiles, worldWidth, worldHeight ) {
|
||||
var xMod,
|
||||
yMod,
|
||||
bounds,
|
||||
@ -693,8 +699,8 @@ function getTile( x, y, level, tileSource, tilesMatrix, time, numTiles, normHeig
|
||||
exists = tileSource.tileExists( level, xMod, yMod );
|
||||
url = tileSource.getTileUrl( level, xMod, yMod );
|
||||
|
||||
bounds.x += 1.0 * ( x - xMod ) / numTiles.x;
|
||||
bounds.y += normHeight * ( y - yMod ) / numTiles.y;
|
||||
bounds.x += worldWidth * ( x - xMod ) / numTiles.x;
|
||||
bounds.y += worldHeight * ( y - yMod ) / numTiles.y;
|
||||
|
||||
tilesMatrix[ level ][ x ][ y ] = new $.Tile(
|
||||
level,
|
||||
@ -805,11 +811,17 @@ function onTileLoad( drawer, tile, time, image ) {
|
||||
function positionTile( tile, overlap, viewport, viewportCenter, levelVisibility, drawer ){
|
||||
var boundsTL = tile.bounds.getTopLeft();
|
||||
|
||||
boundsTL.x *= drawer.scale;
|
||||
boundsTL.y *= drawer.scale;
|
||||
boundsTL.x += drawer.x;
|
||||
boundsTL.y += drawer.y;
|
||||
|
||||
var boundsSize = tile.bounds.getSize(),
|
||||
positionC = viewport.pixelFromPoint( boundsTL, true ),
|
||||
var boundsSize = tile.bounds.getSize();
|
||||
|
||||
boundsSize.x *= drawer.scale;
|
||||
boundsSize.y *= drawer.scale;
|
||||
|
||||
var positionC = viewport.pixelFromPoint( boundsTL, true ),
|
||||
positionT = viewport.pixelFromPoint( boundsTL, false ),
|
||||
sizeC = viewport.deltaPixelsFromPoints( boundsSize, true ),
|
||||
sizeT = viewport.deltaPixelsFromPoints( boundsSize, false ),
|
||||
|
||||
@ -497,13 +497,13 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
|
||||
* @fires OpenSeadragon.Viewer.event:open
|
||||
* @fires OpenSeadragon.Viewer.event:open-failed
|
||||
*/
|
||||
open: function ( tileSource ) {
|
||||
open: function ( tileSource, options ) {
|
||||
var _this = this;
|
||||
|
||||
_this._hideMessage();
|
||||
|
||||
getTileSourceImplementation( _this, tileSource, function( tileSource ) {
|
||||
openTileSource( _this, tileSource );
|
||||
openTileSource( _this, tileSource, options );
|
||||
}, function( event ) {
|
||||
/**
|
||||
* Raised when an error occurs loading a TileSource.
|
||||
@ -1116,6 +1116,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
|
||||
element: _this.drawersContainer,
|
||||
x: options.x !== undefined ? options.x : 0,
|
||||
y: options.y !== undefined ? options.y : 0,
|
||||
scale: options.scale || 1,
|
||||
opacity: options.opacity !== undefined ?
|
||||
options.opacity : _this.opacity,
|
||||
maxImageCacheCount: _this.maxImageCacheCount,
|
||||
@ -1911,7 +1912,7 @@ function getTileSourceImplementation( viewer, tileSource, successCallback,
|
||||
* @function
|
||||
* @private
|
||||
*/
|
||||
function openTileSource( viewer, source ) {
|
||||
function openTileSource( viewer, source, options ) {
|
||||
var i,
|
||||
_this = viewer;
|
||||
|
||||
@ -1992,7 +1993,10 @@ function openTileSource( viewer, source ) {
|
||||
timeout: _this.timeout,
|
||||
debugMode: _this.debugMode,
|
||||
debugGridColor: _this.debugGridColor,
|
||||
crossOriginPolicy: _this.crossOriginPolicy
|
||||
crossOriginPolicy: _this.crossOriginPolicy,
|
||||
x: options.x || 0,
|
||||
y: options.y || 0,
|
||||
scale: options.scale || 1
|
||||
});
|
||||
_this.drawers = [_this.drawer];
|
||||
|
||||
|
||||
@ -5,15 +5,21 @@
|
||||
var self = this;
|
||||
|
||||
this.viewer = OpenSeadragon( {
|
||||
// debugMode: true,
|
||||
debugMode: true,
|
||||
zoomPerScroll: 1.02,
|
||||
id: "contentDiv",
|
||||
prefixUrl: "../../../build/openseadragon/images/",
|
||||
tileSources: "../../data/tall.dzi"
|
||||
prefixUrl: "../../../build/openseadragon/images/"
|
||||
} );
|
||||
|
||||
this.viewer.addHandler( "open", function() {
|
||||
self.addLayer();
|
||||
});
|
||||
|
||||
this.viewer.open("../../data/tall.dzi", {
|
||||
x: 1.5,
|
||||
y: 0,
|
||||
scale: 1
|
||||
});
|
||||
},
|
||||
|
||||
// ----------
|
||||
@ -23,8 +29,9 @@
|
||||
var options = {
|
||||
tileSource: '../../data/wide.dzi',
|
||||
opacity: 1,
|
||||
x: 0.5,
|
||||
y: 0.5
|
||||
x: 0,
|
||||
y: 1.5,
|
||||
scale: 4
|
||||
};
|
||||
|
||||
var addLayerHandler = function( event ) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user