OpenSeadragon plugin for adding guide lines to a viewer
JavaScript HTML CSS
Latest commit 80242da Feb 9, 2017 @hendriklammers hendriklammers Merge branch 'hotfix/1.1.5'
* hotfix/1.1.5:
  Update readme
  Add comments
  Add yarn.lock
Permalink
Failed to load latest commit information.
css Change guide color Dec 2, 2016
dist
images
src
.editorconfig
.eslintrc.json Nicer indentation for switch statement Jun 1, 2016
.gitignore Remove dist from ignore Jun 2, 2016
README.md Update readme Feb 9, 2017
index.html Change popup styling Dec 2, 2016
package.json Use number instead of text input Dec 9, 2016
webpack.config.js
yarn.lock

README.md

OpenSeadragon Guides

An OpenSeadragon plugin that makes it possible to add guidelines to an image.

Demo

https://picturae.github.io/openseadragonselection/#tabs-guides

Usage

This plugin requires a version of OpenSeadragon later than 2.0

Include dist/openseadragon-guides.js after OpenSeadragon in your html. Then after you create a viewer:

viewer.guides({
  allowRotation: false,        // Make it possible to rotate the guidelines (by double clicking them)
  horizontalGuideButton: null, // Element for horizontal guideline button
  verticalGuideButton: null,   // Element for vertical guideline button
  prefixUrl: null,             // Images folder
  removeOnClose: false,        // Remove guidelines when viewer closes
  useSessionStorage: false,    // Save guidelines in sessionStorage
  navImages: {
    guideHorizontal: {
      REST: 'guidehorizontal_rest.png',
      GROUP: 'guidehorizontal_grouphover.png',
      HOVER: 'guidehorizontal_hover.png',
      DOWN: 'guidehorizontal_pressed.png'
    },
    guideVertical: {
      REST: 'guidevertical_rest.png',
      GROUP: 'guidevertical_grouphover.png',
      HOVER: 'guidevertical_hover.png',
      DOWN: 'guidevertical_pressed.png'
    }
  }
});

TODO:

  • Add default styling for the rotation popup