ImageViewerZoomToInteractiveMode Object

Summary

Zooms to a rectangle on the image.

Syntax

JavaScript Syntax
function lt.Controls.ImageViewerZoomToInteractiveMode 
	extends lt.Controls.ImageViewerRubberBandInteractiveMode 
TypeScript Syntax
class lt.Controls.ImageViewerZoomToInteractiveMode() 
	extends lt.Controls.ImageViewerRubberBandInteractiveMode 

Remarks

ImageViewerZoomToInteractiveMode derives from ImageViewerRubberBandInteractiveMode and waits for the rubberBandCompleted event. When this event fires, it will call ImageViewer.zoomToRect.

This interactive mode does not subscribe to any additional events from the InteractiveService beyond those in ImageViewerRubberBandInteractiveMode, and does not make additional modifications to InteractiveEventArgs.isHandled.

For more information, refer to Image Viewer Interactive Modes.

Example

This example will create an ImageViewer, set the interactive mode to Pan/Zoom, and add an image to the viewer.

JavaScript Example
var _label; 
var _firstCall = true; 
 
var example = function () { 
   // Example code goes here 
} 
 
// Create a panel to the top 
var panel = document.createElement("div"); 
panel.style.width = "800"; 
panel.style.height = "800"; 
document.body.appendChild(panel); 
 
// Add an "Example" button to the panel 
var button = document.createElement("button"); 
button.textContent = "&example"; 
button.addEventListener("click", example); 
panel.appendChild(button); 
 
// Add a label to the panel 
_label = document.createElement("h5"); 
_label.style.width = "800"; 
_label.textContent = "Example..."; 
panel.appendChild(_label); 
 
// Create the image viewer taking the rest of the form 
var imageViewerDiv = document.createElement("div"); 
document.body.appendChild(imageViewerDiv); 
this._imageViewer = new lt.Controls.ImageViewer(new lt.Controls.ImageViewerCreateOptions(imageViewerDiv)); 
 
// Add Pan/Zoom interactive mode 
// Click and drag to pan, CTRL-Click and drag to zoom in and out 
this._imageViewer.defaultInteractiveMode = new lt.Controls.ImageViewerPanZoomInteractiveMode(); 
 
// Load an image into the viewer 
var imageUrl = "http://demo.leadtools.com/images/png/ocr1.png"; 
this._imageViewer.url = imageUrl; 
 
_firstCall = true; 

Requirements

Target Platforms

Help Version 19.0.2017.10.18
Products | Support | Contact Us | Copyright Notices
© 1991-2017 LEAD Technologies, Inc. All Rights Reserved.

Leadtools.Controls Assembly