Selectable overlay

[dnoneill]

Hi have added an overlay the viewer. I can't seem to make it selectable (drag over the text and copy and paste it).
The overlay looks like this:
var elem2 =

Text

this.viewer.addOverlay({ element: elem2, location: rect });

The only way I have been able to make the text selectable is by doing below:
viewer.addHandler('canvas-press', (e) => {
e.preventDefault(); //This causes an error that allows the text to be selectable
//e.originalEvent.preventDefault(); //When I do these two lines it does not work
//e.originalEvent.stopPropagation();
});

Any thoughts. I haven't been able to find anything.

[dnoneill]

Figured this out.

Needed to add canvasHandler listener to the element.

new openseadragon.MouseTracker({
element: elem2,
canvasHandler: function() {
}
}).setTracking(true);

[msalsbery]

@dnoneill

For what it's worth, there is no "canvasHandler" in MouseTracker...just attaching a MouseTracker to the element was enough.

That, however, is undocumented behavior, and with v3.0.0 and its major MouseTracker overhaul coming, that may no longer work. You can build and test a 3.0.0 build from the master branch here (or use a preview build from here ) to see if it'll still work in 3.0.0.

If it doesn't still work in 3.0.0, it's a simple change to make it work and you'll still attach a MouseTracker to the overlay element. This CodePen shows an example using 3.0.0 MouseTracker on overlay elements to control this and other common scenarios.