Indicates whether the interpolation operation is to be canceled.
Object.defineProperty(InterpolationEventArgs.prototype, 'isCanceled',
get: function(),
set: function(value)
)
isCanceled: boolean;
true if the interpolation operation is to be canceled, otherwise; false. Default value is false.
Set IsCanceled to true to manually abort this interpolation operation.
For more information, refer to Image Viewer Interpolation.
import { ImageViewer_Example } from "../ImageViewer";
export class ImageViewer_InterpolationModeExample {
private viewerExample;
constructor() {
this.viewerExample = new ImageViewer_Example(this.run);
}
private run = (viewer: lt.Controls.ImageViewer) => {
// NOTE: in order for this example to work, you must include the image processing scripts in a directory:
lt.Controls.ImageViewer.imageProcessingLibrariesPath = "../LT";
const _interpolationModeNames: string[] = ["None", "Resample", "ScaleToGray"];
const _interpolationModeStatus: string[] = ["Started", "Completed", "Aborted", "Error"];
const urls: string[] = [
"http://demo.leadtools.com/images/png/ocr1.png",
"http://demo.leadtools.com/images/png/ocr2.png",
"http://demo.leadtools.com/images/png/ocr3.png",
"http://demo.leadtools.com/images/png/ocr4.png"
];
// Optional: tell the imageViewer to interpolate in parallel
viewer.interpolationRunMode = lt.Controls.InterpolationRunMode.parallel;
// Begin updating the imageviewer (stops rendering until endUpdate is called)
viewer.beginUpdate();
viewer.items.clear();
viewer.viewLayout = new lt.Controls.ImageViewerVerticalViewLayout();
viewer.itemBorderThickness = 5;
viewer.itemMargin = lt.Controls.ControlPadding.createAll(5);
for (let urlIndex = 0; urlIndex < urls.length; urlIndex++) {
const item: lt.Controls.ImageViewerItem = new lt.Controls.ImageViewerItem();
item.text = "Item" + urlIndex;
item.url = urls[urlIndex];
viewer.items.add(item);
}
viewer.endUpdate();
viewer.interpolation.add((sender, e) => {
let lines = [];
const itemIndex: number = viewer.items.indexOf(e.item);
lines.push("Item " + itemIndex + " " + _interpolationModeNames[e.mode] + ": " + _interpolationModeStatus[e.status]);
if (e.status === lt.Controls.InterpolationStatus.error) {
lines.push(" Error name:" + e.error.name + " message:" + e.error.message);
}
addLines(lines);
});
const output = document.getElementById("output");
// Add a select to show the interpolation options
const select = document.createElement("select");
output.appendChild(select);
const interpolationModes: lt.Controls.InterpolationMode[] = [lt.Controls.InterpolationMode.none, lt.Controls.InterpolationMode.resample, lt.Controls.InterpolationMode.scaleToGray];
for (let index = 0; index < interpolationModes.length; index++) {
const value: lt.Controls.InterpolationMode = interpolationModes[index];
const option = document.createElement("option");
option.innerHTML = _interpolationModeNames[value];
select.appendChild(option);
}
select.addEventListener("change", () => {
const index: number = select.selectedIndex;
switch (index) {
case 0:
viewer.interpolationMode = lt.Controls.InterpolationMode.none;
break;
case 1:
viewer.interpolationMode = lt.Controls.InterpolationMode.resample;
break;
case 2:
viewer.interpolationMode = lt.Controls.InterpolationMode.scaleToGray;
break;
}
});
// Start with resample
select.selectedIndex = lt.Controls.InterpolationMode.resample;
viewer.interpolationMode = lt.Controls.InterpolationMode.resample;
const textOutput = document.createElement("div");
output.appendChild(textOutput);
const addLines = (messages) => {
const lines: string = messages.map((line) => { return "<p>" + line + "</p>" });
textOutput.innerHTML += lines;
}
}
}
export class ImageViewer_Example {
// LEADTOOLS ImageViewer to be used with this example
protected imageViewer: lt.Controls.ImageViewer = null;
// Generic state value used by the examples
public timesClicked: number = 0;
constructor(callback?: (viewer: lt.Controls.ImageViewer) => void) {
// Set the LEADTOOLS license. Replace this with your actual license file
lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null);
// Create an image viewer inside the imageViewerDiv element
const imageViewerDiv = document.getElementById("imageViewerDiv");
const createOptions: lt.Controls.ImageViewerCreateOptions = new lt.Controls.ImageViewerCreateOptions(imageViewerDiv);
this.imageViewer = new lt.Controls.ImageViewer(createOptions);
this.imageViewer.viewVerticalAlignment = lt.Controls.ControlAlignment.center;
this.imageViewer.viewHorizontalAlignment = lt.Controls.ControlAlignment.center;
this.imageViewer.autoCreateCanvas = true;
// Add Pan/Zoom interactive mode
// Click and drag to pan, CTRL-Click and drag to zoom in and out
this.imageViewer.interactiveModes.add(new lt.Controls.ImageViewerPanZoomInteractiveMode());
// Load an image
this.imageViewer.imageUrl = "https://demo.leadtools.com/images/jpeg/cannon.jpg";
this.imageViewer.zoom(lt.Controls.ControlSizeMode.fit, .9, this.imageViewer.defaultZoomOrigin);
const exampleButton = document.getElementById("exampleButton");
exampleButton.addEventListener("click", () => {
this.timesClicked++;
// Run the example
if (callback)
callback(this.imageViewer);
});
}
}
import { ImageViewer_Example } from "../ImageViewer";
export class ImageViewer_InterpolationModeExample {
viewerExample;
constructor() {
this.viewerExample = new ImageViewer_Example(this.run);
}
run = (viewer) => {
// NOTE: in order for this example to work, you must include the image processing scripts in a directory:
lt.Controls.ImageViewer.imageProcessingLibrariesPath = "../LT";
const _interpolationModeNames = ["None", "Resample", "ScaleToGray"];
const _interpolationModeStatus = ["Started", "Completed", "Aborted", "Error"];
const urls = [
"http://demo.leadtools.com/images/png/ocr1.png",
"http://demo.leadtools.com/images/png/ocr2.png",
"http://demo.leadtools.com/images/png/ocr3.png",
"http://demo.leadtools.com/images/png/ocr4.png"
];
// Optional: tell the imageViewer to interpolate in parallel
viewer.interpolationRunMode = lt.Controls.InterpolationRunMode.parallel;
// Begin updating the imageviewer (stops rendering until endUpdate is called)
viewer.beginUpdate();
viewer.items.clear();
viewer.viewLayout = new lt.Controls.ImageViewerVerticalViewLayout();
viewer.itemBorderThickness = 5;
viewer.itemMargin = lt.Controls.ControlPadding.createAll(5);
for (let urlIndex = 0; urlIndex < urls.length; urlIndex++) {
const item = new lt.Controls.ImageViewerItem();
item.text = "Item" + urlIndex;
item.url = urls[urlIndex];
viewer.items.add(item);
}
viewer.endUpdate();
viewer.interpolation.add((sender, e) => {
let lines = [];
const itemIndex = viewer.items.indexOf(e.item);
lines.push("Item " + itemIndex + " " + _interpolationModeNames[e.mode] + ": " + _interpolationModeStatus[e.status]);
if (e.status === lt.Controls.InterpolationStatus.error) {
lines.push(" Error name:" + e.error.name + " message:" + e.error.message);
}
addLines(lines);
});
const output = document.getElementById("output");
// Add a select to show the interpolation options
const select = document.createElement("select");
output.appendChild(select);
const interpolationModes = [lt.Controls.InterpolationMode.none, lt.Controls.InterpolationMode.resample, lt.Controls.InterpolationMode.scaleToGray];
for (let index = 0; index < interpolationModes.length; index++) {
const value = interpolationModes[index];
const option = document.createElement("option");
option.innerHTML = _interpolationModeNames[value];
select.appendChild(option);
}
select.addEventListener("change", () => {
const index = select.selectedIndex;
switch (index) {
case 0:
viewer.interpolationMode = lt.Controls.InterpolationMode.none;
break;
case 1:
viewer.interpolationMode = lt.Controls.InterpolationMode.resample;
break;
case 2:
viewer.interpolationMode = lt.Controls.InterpolationMode.scaleToGray;
break;
}
});
// Start with resample
select.selectedIndex = lt.Controls.InterpolationMode.resample;
viewer.interpolationMode = lt.Controls.InterpolationMode.resample;
const textOutput = document.createElement("div");
output.appendChild(textOutput);
const addLines = (messages) => {
const lines = messages.map((line) => { return "<p>" + line + "</p>" });
textOutput.innerHTML += lines;
}
}
}
export class ImageViewer_Example {
// LEADTOOLS ImageViewer to be used with this example
imageViewer = null;
// Generic state value used by the examples
timesClicked = 0;
constructor(callback) {
// Set the LEADTOOLS license. Replace this with your actual license file
lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null);
// Create an image viewer inside the imageViewerDiv element
const imageViewerDiv = document.getElementById("imageViewerDiv");
const createOptions = new lt.Controls.ImageViewerCreateOptions(imageViewerDiv);
this.imageViewer = new lt.Controls.ImageViewer(createOptions);
this.imageViewer.viewVerticalAlignment = lt.Controls.ControlAlignment.center;
this.imageViewer.viewHorizontalAlignment = lt.Controls.ControlAlignment.center;
this.imageViewer.autoCreateCanvas = true;
// Add Pan/Zoom interactive mode
// Click and drag to pan, CTRL-Click and drag to zoom in and out
this.imageViewer.interactiveModes.add(new lt.Controls.ImageViewerPanZoomInteractiveMode());
// Load an image
this.imageViewer.imageUrl = "https://demo.leadtools.com/images/jpeg/cannon.jpg";
this.imageViewer.zoom(lt.Controls.ControlSizeMode.fit, .9, this.imageViewer.defaultZoomOrigin);
const exampleButton = document.getElementById("exampleButton");
exampleButton.addEventListener("click", () => {
this.timesClicked++;
// Run the example
if (callback)
callback(this.imageViewer);
});
}
}
<!doctype html>
<html lang="en">
<title>Controls Example | InterpolationMode</title>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="../../LT/Leadtools.js"></script>
<script src="../../LT/Leadtools.Controls.js"></script>
<script src="../../LT/Leadtools.Annotations.Engine.js"></script>
<script src="../../LT/Leadtools.Annotations.Designers.js"></script>
<script src="../../LT/Leadtools.Annotations.Rendering.Javascript.js"></script>
<script src="../../LT/Leadtools.Annotations.Automation.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Main.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Color.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Core.js"></script>
<script src="../../LT/Leadtools.ImageProcessing.Effects.js"></script>
<script src="../../LT/Leadtools.Document.js"></script>
<script src="../../LT/Leadtools.Document.Viewer.js"></script>
<style>
body {
font-family: 'Segoe UI', sans-serif;
}
#imageViewerDiv {
border: 1px solid #888;
width: 500px;
height: 500px;
background-color: #eee;
}
</style>
<!-- All demo files are bundled and appended to the window -->
<script src="../../bundle.js" type="text/javascript"></script>
</head>
<body>
<p>Press and drag on the image to pan.</p>
<p>Hold down the control key and press and drag on the image or pinch with two fingers to zoom in and out.</p>
<div>
<button type="button" id="exampleButton">Run Example</button>
</div>
<div id="imageViewerDiv"></div>
<div id="output"></div>
</body>
<script>
window.onload = () => {
const example = new window.examples.ImageViewer.InterpolationMode();
};
</script>
</html>
Help Collections
Raster .NET | C API | C++ Class Library | HTML5 JavaScript
Document .NET | C API | C++ Class Library | HTML5 JavaScript
Medical .NET | C API | C++ Class Library | HTML5 JavaScript
Medical Web Viewer .NET
Multimedia
Direct Show .NET | C API | Filters
Media Foundation .NET | C API | Transforms
Supported Platforms
.NET, Java, Android, and iOS/macOS Assemblies
Imaging, Medical, and Document
C API/C++ Class Libraries
Imaging, Medical, and Document
HTML5 JavaScript Libraries
Imaging, Medical, and Document