Fork me on GitHub

OpenSeadragon 5.0.0

example: zoom and pan options

OpenSeadragon provides several options for constraining the minimum and maximum zoom range as well as the range of panning.

These features are generally controlled through various combinations of the options:

Constraining by Viewport Visibility as a Ratio, and Constraining During Panning

The option visibilityRatio, which is by default 0.5, ensures that you cannot pan the image far enough to fill the viewport with more than 50% background. Setting it to 1, as in this example, ensures the image cannot be panned to show any background. Normally OpenSeadragon will enforce this by "bouncing back" when the drag is released. In this example we also add constrainDuringPan: true which stops the drag immediately when it hits the bounding area.

A visibilityRatio of 1 With constrainDuringPan Enabled

Below is the relevant configuration.

OpenSeadragon({
    ...
    visibilityRatio: 1.0,
    constrainDuringPan: true,
    ...
});

Constraining Pan Direction and Using a Default Zoom Level

In this example we combine a number of options to produce an effect similar to a "fit-width" PDF view.

Vertical Scroll and Zoom

Below is the relevant configuration.

OpenSeadragon({
    ...
    panHorizontal: 	false,
    defaultZoomLevel: 	1,
    minZoomLevel: 	1,
    maxZoomLevel: 	1,
    visibilityRatio: 	1,
    ...
});