mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2024-11-29 08:36:10 +03:00
Code Issues Projects Releases Wiki Activity

Overlays performance optimization. See #359

Browse Source
This commit is contained in:
Antoine Vandecreme 2014-03-20 15:39:31 -04:00
parent 1643660f17
commit 4be56cdb52
2 changed files with 27 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/overlay.js
View File

@ -78,7 +78,11 @@
* @param {OpenSeadragon.OverlayPlacement} [options.placement=OpenSeadragon.OverlayPlacement.TOP_LEFT] * @param {OpenSeadragon.OverlayPlacement} [options.placement=OpenSeadragon.OverlayPlacement.TOP_LEFT]
* Relative position to the viewport. * Relative position to the viewport.
* Only used if location is a {@link OpenSeadragon.Point}. * Only used if location is a {@link OpenSeadragon.Point}.
* @param {OpenSeadragon.Overlay.OnDrawCallback} options.onDraw * @param {OpenSeadragon.Overlay.OnDrawCallback} [options.onDraw]
* @param {Boolean} [options.checkResize=true] Set to false to avoid to
* check the size of the overlay everytime it is drawn when using a
* {@link OpenSeadragon.Point} as options.location. It will improve
* performances but will cause a misalignment if the overlay size changes.
*/ */
$.Overlay = function( element, location, placement ) { $.Overlay = function( element, location, placement ) {
@ -125,6 +129,8 @@
options.placement : options.placement :
$.OverlayPlacement.TOP_LEFT; $.OverlayPlacement.TOP_LEFT;
this.onDraw = options.onDraw; this.onDraw = options.onDraw;
this.checkResize = options.checkResize === undefined ?
true : options.checkResize;
}; };
$.Overlay.prototype = /** @lends OpenSeadragon.Overlay.prototype */{ $.Overlay.prototype = /** @lends OpenSeadragon.Overlay.prototype */{
@ -212,19 +218,12 @@
var element = this.element, var element = this.element,
style = this.style, style = this.style,
scales = this.scales, scales = this.scales,
drawerCenter = new $.Point(
viewport.viewer.drawer.canvas.width / 2,
viewport.viewer.drawer.canvas.height / 2
),
degrees = viewport.degrees, degrees = viewport.degrees,
position = viewport.pixelFromPoint( position = viewport.pixelFromPoint(
this.bounds.getTopLeft(), this.bounds.getTopLeft(),
true true
), ),
size = viewport.deltaPixelsFromPoints( size,
this.bounds.getSize(),
true
),
overlayCenter; overlayCenter;
if ( element.parentNode != container ) { if ( element.parentNode != container ) {
@ -232,10 +231,18 @@
element.prevElementParent = element.parentNode; element.prevElementParent = element.parentNode;
element.prevNextSibling = element.nextSibling; element.prevNextSibling = element.nextSibling;
container.appendChild( element ); container.appendChild( element );
this.size = $.getElementSize( element );
} }
if ( !scales ) { if ( scales ) {
this.size = $.getElementSize( element ); size = viewport.deltaPixelsFromPoints(
this.bounds.getSize(),
true
);
} else if ( this.checkResize ) {
size = $.getElementSize( element );
} else {
size = this.size;
} }
this.position = position; this.position = position;
@ -254,6 +261,10 @@
if( degrees !== 0 && this.scales ) { if( degrees !== 0 && this.scales ) {
overlayCenter = new $.Point( size.x / 2, size.y / 2 ); overlayCenter = new $.Point( size.x / 2, size.y / 2 );
var drawerCenter = new $.Point(
viewport.viewer.drawer.canvas.width / 2,
viewport.viewer.drawer.canvas.height / 2
);
position = position.plus( overlayCenter ).rotate( position = position.plus( overlayCenter ).rotate(
degrees, degrees,
drawerCenter drawerCenter
@ -263,10 +274,10 @@
size = new $.Point( Math.abs( size.x ), Math.abs( size.y ) ); size = new $.Point( Math.abs( size.x ), Math.abs( size.y ) );
} }
// call the onDraw callback if there is one to allow, this allows someone to overwrite // call the onDraw callback if it exists to allow one to overwrite
// the drawing/positioning/sizing of the overlay // the drawing/positioning/sizing of the overlay
if (this.onDraw) { if ( this.onDraw ) {
this.onDraw(position, size, element); this.onDraw( position, size, element );
} else { } else {
style.left = position.x + "px"; style.left = position.x + "px";
style.top = position.y + "px"; style.top = position.y + "px";

3
src/viewer.js
View File

@ -1811,7 +1811,8 @@ function getOverlayObject( viewer, overlay ) {
element: element, element: element,
location: location, location: location,
placement: placement, placement: placement,
onDraw: overlay.onDraw onDraw: overlay.onDraw,
checkResize: overlay.checkResize
}); });
} }