VintaSoft Imaging .NET SDK 12.4: Documentation for Web developer
In This Topic
    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:



    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 an example 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:

    /**
     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);
        }
    }