Search code examples
openseadragon

Set OpenSeaDragon Viewer Home to "Top" of Image

I'm using OSD to display a few pages from a PDF. Each page is lined up one on top of the other.

Thumbnail

I'd like the viewer to start at the top of the image, zoomed to fit. I've played with various settings, but what seems to work for one image of three pages, doesn't work for another image of five. I can get close to what I want with this command:

viewer.viewport.panTo(new OpenSeadragon.Point(.5, .5));
viewer.viewport.zoomTo(1);

But I'll be honest that I don't quite understand what that means, and I have no idea how to set this as the "home" bounds. I've been through the documentation several times, but this escapes me.

Appreciate any guidance!

Solution

  • Rather than using panTo and zoomTo, I recommend using fitBounds instead. You'll want to base it off of the aspect ratio of your viewer so the result is snug. Something like so: 

    var oldBounds = viewer.viewport.getBounds(); 
var newBounds = new OpenSeadragon.Rect(0, 0, 1, oldBounds.height / oldBounds.width); 
viewer.viewport.fitBounds(newBounds, true);

    The true in the fitBounds is to make it snap there immediately instead of animating.