Visual tools for web image viewer

In This Topic

1. JavaScript classes, which represent visual tools for web image viewer

The visual tools complement functionality of WebImageViewerJS class and allow to process images visually.

Here is a list of standard visual tools supported by the SDK:

WebCompositeVisualToolJS - a visual tool, which allows to combine functionality of several visual tools. Available in Vintasoft.Imaging.js.
Visual tools, which allow to work with images in web image viewer
- WebZoomToolJS - a visual tool, which allows to zoom an image in image viewer. Available in Vintasoft.Imaging.js.
- WebPanToolJS - a visual tool, which allows to pan an image in image viewer. Available in Vintasoft.Imaging.js.
- WebMagnifierToolJS - a visual tool, which allows to magnify an image region in image viewer. Available in Vintasoft.Imaging.js.
- WebHighlightToolJS - a visual tool, which allows to highlight custom image regions in image viewer. Available in Vintasoft.Imaging.js.
- WebRectangularSelectionToolJS - a visual tool, which allows to select a rectangular image region in image viewer. Available in Vintasoft.Imaging.js.
- WebMultiRectangularSelectionToolJS - a visual tool, which allows to select an image region, which consists from multiple rectangles, in image viewer. Available in Vintasoft.Imaging.js.
- WebZoomSelectionToolJS - a visual tool, which allows to select and zoom an image region in image viewer. Available in Vintasoft.Imaging.js.
- WebTextSelectionToolJS - a visual tool, which allows to select text on image in image viewer. Available in Vintasoft.Imaging.js.
- WebDocumentNavigationToolJS - a visual tool, which allows to display and execute actions (links, naviagtion, ...) of an image in image viewer. Available in Vintasoft.Imaging.js.
Visual tools, which allow to annotate images in web image viewer
- WebAnnotationVisualToolJS - a visual tool that allows to annotate images in image viewer. Available in Vintasoft.Imaging.Annotation.js.
Visual tools, which allow to work with PDF pages in web image viewer
- WebPdfImageExtractorToolJS - a visual tool, which allows to select and extract images on PDF page in image viewer. Available in Vintasoft.Imaging.Pdf.js.
- WebPdfInteractiveFormToolJS - a visual tool, which allows to view, fill and edit the interactive form fields of PDF document. Available in Vintasoft.Imaging.Pdf.js.
- WebPdfRemoveContentToolJS - a visual tool, which allows to remove and black out content of PDF pages. Available in Vintasoft.Imaging.Pdf.js.

2. Web Document Viewer UI for visual tools for web image viewer

The WebUiVisualToolButtonJS class represent a web UI button for enabling the specified visual tool in image viewer.

Here is an example of JavaScript code, which demonstrates how to create an UI button, which activates the Magnifier visual tool in image viewer of web document viewer:

The WebUiVisualToolsToolbarPanelJS class repesents a web UI toolbar panel that allows to select visual tools "Pan", "Rectangular selection", "Magnifier", "Zoom", "Zoom selection".

Here is screenshot of panel with visual tools in web application:

Here is JavaScript code that shows how to create UI button, which enables Annotation+Pan tool, and register new button instead of standard UI button, which enables only Pan tool:

JavaScript

/**
 Creates UI button for activating the visual tool, which allows to annotate and pan images in image viewer.
*/
function __createAnnotationAndPanToolButton() {
    return new Vintasoft.Imaging.DocumentViewer.UIElements.WebUiVisualToolButtonJS({
        cssClass: "vsdv-tools-panButton",
        title: "Pan",
        localizationId: "panToolButton"
    }, "AnnotationVisualTool,PanTool");
}

/**
 Registers new UI button, which enables Annotation+Pan tool, instead of standard UI button, which enables only Pan tool.
*/
function __registerNewPanButton() {
    with (Vintasoft.Imaging.DocumentViewer) {
        // register the "Pan" button in web UI elements factory
        WebUiElementsFactoryJS.registerElement("panToolButton", __createAnnotationAndPanToolButton);
    }
}

Send Feedback