An OpenSeadragon plugin that adds canvas overlay capability
Switch branches/tags
Nothing to show
Clone or download
altert Merge pull request #7 from lk-jeffpeck/patch-1
require openseadragon if it doesn't exist
Latest commit e69cec3 Mar 30, 2018


An OpenSeadragon plugin that adds canvas overlay capability.

Compatible with OpenSeadragon 2.2.0 or greater.


To use, include the openseadragon-canvas-overlay.js file after openseadragon.js on your web page.

To add canvas overlay capability to your OpenSeadragon Viewer, call canvasOverlay(options) on it. It has two parameters: onRedraw - callback function that does the actual drawing, and clearBeforeRedraw (default as true): clear canvas before redrawing.

For example:

var overlay = this.viewer.canvasOverlay({
    onRedraw:function() {      
        overlay.context2d().fillStyle = "red";
        overlay.context2d().fillRect(0, 0, 500, 500);            

This will return a new object with the following methods:

  • canvas(): Returns canvas element.
  • resize(): If your viewer changes size, you'll need to resize the canvas overlay by calling this method.
  • clear(): Clears canvas.
  • context2d(): Gives access to 2d context of canvas, to draw on it.

See online demo or demo.html for an example of it in use.