ImageViewerPanControl Object

Supports displaying a scaled view of an ImageViewer into an external HTML5 Canvas Element with panning support.

Object Model

Syntax

JavaScript

function Leadtools.Controls.ImageViewerPanControl()

Remarks

The ImageViewerPanControl is used to display a scaled view of an image, which is also being displayed in the ImageViewer control on an external target canvas at a size that would require scrolling. ImageViewerPanControl will maintain the images aspect ratio. A colored pan rectangle will be displayed to indicate the portion of the image currently being displayed in the viewer associated with this pan control.

By default, when the the user clicks inside the pan control and drags using the mouse or touch, the pan rectangle will move with along.

Example

JavaScript

var control = document.createElement("canvas");
control.width = 400;
document.body.appendChild(control);

var panControl = new lt.Controls.ImageViewerPanControl();
panControl.enablePan = true;
panControl.borderColor = "Yellow";
panControl.outsideColor = "rgba(0, 0, 0, 0.5)";
panControl.workingCursor = "Hand";
panControl.control = control;

panControl.imageViewer = this._imageViewer;

ImageViewerPanControl Object

Reference