RedirectCanvas Property

External HTML5 Canvas Element that can be used to re-direct the spy glass render.

Syntax

JavaScript

get_redirectCanvas();
set_redirectCanvas(value);
Object.defineProperty('redirectCanvas');

Property Value

Type	Description
CanvasElement	The external `canvas` that can be used to re-direct the spy glass render. Default value is null.

Remarks

ImageViewerSpyGlassInteractiveMode supports redirecting the render output to an external canvas instead of the area under the mouse in the viewer. When this value is set to a valid canvas on the page, the interactive mode will use this canvas as the target for the spy glass rendering instead of creating an internal instance and rendering the glass over the image viewer.

Example

JavaScript

var panel = document.createElement("div");
panel.style.width = "300";
document.body.appendChild(panel);

var label = document.createElement("h5");
label.textContent = "Double click to switch between viewer and here";
panel.appendChild(label);

var redirectCanvas = document.createElement("canvas");
redirectCanvas.style.background = "gray";
redirectCanvas.style.visibility = "hidden";
panel.appendChild(redirectCanvas);

var mode = new lt.Controls.ImageViewerMagnifyGlassInteractiveMode();
mode.workStarted.add(function (sender, e) {
   if (mode.redirectCanvas != null)
      mode.redirectCanvas.style.visibility = "visible";
});

mode.workCompleted.add(function (sender, e) {
   if (mode.redirectCanvas != null)
      mode.redirectCanvas.style.visibility = "hidden";
});

mode.redirectCanvas = redirectCanvas;

panel.addEventListener("dblclick", function () {
   if (mode.redirectCanvas == null)
      mode.redirectCanvas = redirectCanvas;
   else
      mode.redirectCanvas = null;
});

this._imageViewer.interactiveModes.clearItems();
this._imageViewer.interactiveModes.beginUpdate();
this._imageViewer.interactiveModes.add(mode);
this._imageViewer.interactiveModes.endUpdate();

var _shapeComboBox = document.createElement("select");
document.body.appendChild(_shapeComboBox);

for (var shape in lt.Controls.ImageViewerSpyGlassShape) {
   if (shape.toString() == "__typeName")
      break;
   var option = document.createElement("option");
   option.textContent = shape.toString();
   _shapeComboBox.appendChild(option);
   _shapeComboBox.selectedIndex = mode.shape;
   _shapeComboBox.addEventListener("change", function () {
      mode.shape = _shapeComboBox.selectedIndex;
   });
}

RedirectCanvas Property

Property Value

Reference