OpenSeadragon source
OpenSeadragon Features
NIST-ISG/WebDeepZoomToolkit
NIST Computational Science in Metrology
API
OpenSeadragon API
OpenSeadragon Options
OpenSeadragon Class: Viewer
OpenSeadragon Class: Viewport
OpenSeadragon Class: Navigator
OpenSeadragon Class: Overlay
Open() returns Viewer
Viewer contains Viewport, Navigator, ControlDock
OpenSeadragon Plugins
OpenSeadragon Plugins
Making OpenSeadragon Plugins · openseadragon/openseadragon Wiki
Navigator (minimap) support is built-in
Sequence (previous/next) support is built-in
MartinPluta/OpenSeadragonMultiRow for multiple view angle
NIST-ISG/OpenSeadragonScalebar
NIST-ISG/OpenSeadragonFiltering
Coordinate System
Viewport Coordinates | OpenSeadragon ❗!important
OpenSeadragon Class: Viewport
When you get a click, it'll be in window pixel coordinates. You can then translate it into viewport coordinates (logical point, which goes from 0.0 on the left to 1.0 on the right). You can then translate those into pixel coordinates of the image. Here's how it would look all together:
// Assuming we have an OpenSeadragon Viewer called "viewer", we can catch the clicks
// with addHandler like so:
viewer.addHandler("canvas-click", function (event) {
// The canvas-click event gives us a position in web coordinates.
var webPoint = event.position;
// Convert that to viewport coordinates, the lingua franca of OpenSeadragon coordinates.
var viewportPoint = viewer.viewport.pointFromPixel(webPoint);
// Convert from viewport coordinates to image coordinates.
var imagePoint = viewer.viewport.viewportToImageCoordinates(viewportPoint);
// Show the results.
console.log(
webPoint.toString(),
viewportPoint.toString(),
imagePoint.toString(),
);
});Openseadragon image cordinates - Developer Blogger (Improve Your Develop Skill)
msalsbery/OpenSeadragonViewerInputHook overrides mouse tracking, see also OpenSeadragon Class: MouseTracker
Zoom
msalsbery/OpenSeadragonImagingHelper map client (browser) coordinates to data coordinates docs demo
The demo also shows how to anchor an SVG annotation to the image
OpenSeadragonZoomLevels source limit zoom level
Medical image viewer · Issue #34 · openseadragon/openseadragon
ZOOM Mismatch in overlay · Issue #542 · openseadragon/openseadragon
Add the option for a zoom handler callback by lukemurray · Pull Request #160 · openseadragon/openseadragon
Zoom level: the ratio of the image's native size to the displayed size
Zoom factor / Pixel Zoom: the ratio of the displayed size to the image's native size
Image zoom: ratio of the original image size to displayed image size. 1 means original image size, 0.5 half size...
Viewport zoom: ratio of the displayed image's width to viewport's width. 1 means identical width, 2 means image's width is twice the viewport's width... Note: not accurate with multi-image.
var viewportZoom = viewer.viewport.getZoom(true);
var imageZoom = viewer.viewport.viewportToImageZoom(viewportZoom);Overlay
OpenSeadragon SVG Overlays
Disable overlay interaction with $('.openseadragon-canvas').find('svg').css('pointer-events', 'none');
altert/OpenseadragonFabricjsOverlay: fabricjs canvas overlay for openseadragon
Overlays improvements by avandecreme · Pull Request #896 · openseadragon/openseadragon
Add Line and Polygon Overlay · Issue #3 · thatcher/openseadragon
Add Line and Polygon Overlay · Issue #14 · openseadragon/openseadragon
How to get overlay's child to scale with overlay · Issue #906 · openseadragon/openseadragon
openseadragon/svg-overlay
Emigre/openseadragon-annotations
msalsbery/OpenSeadragonAnnoHost annotation, WIP
picturae/openseadragonselection make rectangular selection
dgutman/OpenSeadragon-Plugins (WIP, evolved to svg-overlay)
demo gh-pages
Port of Raphael Vector Overlays for Seadragon AJAX | no.5 geekvault
Saving and Restoring FOV
You should also be able to
var box = viewer.viewport.getBounds()to get the current locationviewer.viewport.fitBounds(box)to return to that location.
Get and restore zoom level and image position · Issue #418 · openseadragon/openseadragon
Icons
peterthomet/openseadragon-flat-toolbar-icons
MartinPluta/OpenSeadragonCustomIcons
Of cause you can use custom toolbar and interact with OpenSeadragon via API.
Issues
OSD in an iframe fails to end drag · Issue #579 · openseadragon/openseadragon
Dynamically toggle navigator? · Issue #907 · openseadragon/openseadragon
var navigatorShown = true;
function toggleNavigator() {
navigatorShown = !navigatorShown;
viewer.navigator.element.style.display = navigatorShown ? "block" : "none";
}http://openseadragon.github.io/docs/OpenSeadragon.Viewer.html#_showMessage