Class: PaperOverlay

OSDPaperjsAnnotation.PaperOverlay(viewer, opts)

Represents a PaperOverlay associated with an OpenSeadragon Viewer. A PaperOverlay is a Paper.js overlay that can be either synced to the zoomable image or fixed to the viewer.

Constructor

new PaperOverlay(viewer, opts)

Creates an instance of the PaperOverlay. overlayType: 'image' to zoom/pan with the image(s), 'viewer' stay fixed.
Parameters:
Name Type Description
viewer OpenSeadragon.Viewer The viewer object.
opts Object The options for the overlay.
Properties
Name Type Attributes Default Description
overlayType string <optional>
 'image' "image" or "viewer". The type of overlay: 'image' to zoom/pan with the image(s), 'viewer' stay fixed.
Properties:
Name Type Description
viewer OpenSeadragon.Viewer The OpenSeadragon viewer object.
overlayType string "image" or "viewer"
paperScope paper.Scope the paper.Scope object for this overlay
Source:

Members

scaleFactor

The scale factor for the overlay. Equal to the pixel width of the viewer's drawing canvas
Source:

Methods

addClass(c) → {PaperOverlay}

This method allows you to add CSS classes to the canvas element of the overlay. Adding classes can be useful for styling the overlay or associating specific styles with it.
Parameters:
Name Type Description
c string The class name to add to the canvas element.
Source:
Returns:
The PaperOverlay object itself, allowing for method chaining.
Type
PaperOverlay

addEventListener(event, listener) → {PaperOverlay}

This method allows you to add custom event listeners to the canvas element of the overlay. You can listen for various events, such as mouse clicks or custom events, and perform actions accordingly.
Parameters:
Name Type Description
event string The name of the event to listen for on the canvas element.
listener function The function to call when the specified event is triggered.
Source:
Returns:
The PaperOverlay object itself, allowing for method chaining.
Type
PaperOverlay

addViewerButton(params) → {any}

Adds a button to the viewer. The button is created with the provided parameters.
Parameters:
Name Type Description
params Object The parameters for the button.
Properties
Name Type Description
tooltip string The tooltip text for the button.
onClick string The function to be called when the button is clicked.
faIconClass string Font Awesome icon classes for the button icon.
Source:
Returns:
The button object.
Type
any

autoRescaleItems(shouldHandle)

This method allows you to enable or disable automatic rescaling of items within the overlay based on the zoom level of the OpenSeadragon viewer. When enabled, items in the overlay will be rescaled automatically as the viewer's zoom level changes.
Parameters:
Name Type Default Description
shouldHandle boolean false Whether to enable or disable automatic rescaling.
Source:
See:
  • rescaleItems

bringToFront()

Brings the overlay to the front, making it appear on top of other overlays. This method changes the z-index of the overlay to bring it forward. The overlay will appear on top of any other overlays that are currently on the viewer.
Source:

canvas() → {HTMLCanvasElement}

Gets the canvas element of the overlay.
Source:
Returns:
The canvas element.
Type
HTMLCanvasElement

clear()

Clears the overlay by removing all paper items from the overlay's Paper.js project. This method removes all Paper.js items (such as paths, shapes, etc.) that have been added to the overlay. After calling this method, the overlay will be empty, and any content that was previously drawn on it will be removed.
Source:

destroy(viewerDestroyed)

Destroys the overlay and removes it from the viewer. This method cleans up the resources associated with the overlay and removes it from the viewer.
Parameters:
Name Type Description
viewerDestroyed boolean Whether the viewer has been destroyed. If `viewerDestroyed` is true, it indicates that the viewer itself is being destroyed, and this method will not attempt to remove the overlay from the viewer, as it will be automatically removed during the viewer's cleanup process.
Source:

getImageData(x, y, w, h) → {ImageData}

Gets the image data from the viewer.
Parameters:
Name Type Description
x number The x coordinate of the top left corner of the image data.
y number The y coordinate of the top left corner of the image data.
w number The width of the image data.
h number The height of the image data.
Source:
Returns:
The image data.
Type
ImageData

getViewportRaster(withImageData) → {any}

Gets a raster object representing the viewport.
Parameters:
Name Type Description
withImageData boolean Whether to include image data in the raster object.
Source:
Returns:
The raster object.
Type
any

paperToCanvasCoordinates()

Convert from paper coordinate frame to the pixel on the underlying canvas element
Source:

removeClass(c) → {PaperOverlay}

This method allows you to remove CSS classes from the canvas element of the overlay. Removing classes can be useful for updating the overlay's appearance or changing its associated styles.
Parameters:
Name Type Description
c string The class name to remove from the canvas element.
Source:
Returns:
The PaperOverlay object itself, allowing for method chaining.
Type
PaperOverlay

removeEventListener(event, listener) → {PaperOverlay}

This method allows you to remove a previously added event listener from the canvas element of the overlay. If the specified event and listener pair match an existing event listener, it will be removed.
Parameters:
Name Type Description
event string The name of the event to stop listening for on the canvas element.
listener function The function that was previously registered as the event listener.
Source:
Returns:
The PaperOverlay object itself, allowing for method chaining.
Type
PaperOverlay

rescaleItems()

Rescales all items in the overlay according to the current zoom level of the viewer. This method manually rescales all Paper.js items that have the `rescale` property set to a truthy value. The rescaling is based on the current zoom level of the viewer, ensuring that the items maintain their relative size on the viewer.
Source:
See:
  • autoRescaleItems

sendToBack()

Sends the overlay to the back, making it appear behind other overlays. This method changes the z-index of the overlay to send it backward. The overlay will appear behind any other overlays that are currently on the viewer.
Source:

setAttribute(attr, value) → {PaperOverlay}

This method allows you to set custom attributes on the canvas element of the overlay. Setting attributes can be useful for additional customization or to store metadata related to the overlay.
Parameters:
Name Type Description
attr string The name of the attribute to set on the canvas element.
value string The value to set for the specified attribute.
Source:
Returns:
The PaperOverlay object itself, allowing for method chaining.
Type
PaperOverlay

setOSDMouseNavEnabled(enabled) → {boolean}

This method allows you to enable or disable mouse navigation in the viewer associated with the overlay. Mouse navigation includes actions such as panning and zooming. It returns a boolean value indicating whether mouse navigation was enabled before the method call.
Parameters:
Name Type Default Description
enabled boolean true Whether to enable or disable mouse navigation.
Source:
Returns:
Whether mouse navigation was enabled before the call.
Type
boolean