Document Solutions Image Viewer
    Preparing search index...

    Class ImageFiltersPlugin

    Image Filters Plugin. Adds the "Image Filters" button.

    <script src="gcimageviewer.js"></script></head>
    <script src="plugins/imageFilters.js"></script>
    <script>
    const viewer = new GcImageViewer("#root");
    viewer.addPlugin(new ImageFiltersPlugin());
    </script>

    Constructors

    Methods

    • Called when parent viewer requests confirm and apply changes, usually when the Ctrl+Enter or Enter key is pressed.

      Returns boolean | void | Promise<boolean | void>

    • Called when parent viewer requests cancel changes, usually when the ESCAPE key is pressed.

      Returns boolean | void | Promise<boolean | void>

    • Undo viewer transaction step. Return true if undo operation is consumed.

      Returns boolean | void

    • Redo viewer transaction step. Return true if redo operation is consumed.

      Returns boolean | void

    • Apply image filter.

      Parameters

      • filterName: string

        Filter name to apply.

      • Optionalintensity: number

        Filter intensity.

      Returns Promise<boolean>

      True if filter was applied successfully.

    • Determines whether the specified image format is supported for modifications.

      Parameters

      • imageFormat: string | ImageFormatCode

        The image format to check, either as an enum value or string.

      • OptionalallowUnknown: boolean

        If true, allows unknown formats (ImageFormatCode.Default) to be considered supported.

      Returns boolean

      True if the format is supported for modifications, false otherwise.

      The following formats are explicitly not supported:

      • TIFF (ImageFormatCode.TIFF)
      • SVG (ImageFormatCode.SVG)
      • ICO (ImageFormatCode.ICO)
      • GIF (ImageFormatCode.GIF)
      // Check if PNG is supported
      const supported = isImageFormatSupported(ImageFormatCode.PNG);
      // Check if an unknown format is supported (returns false by default)
      const supported = isImageFormatSupported('custom-format');
      // Check if an unknown format is supported (returns true when allowUnknown is true)
      const supported = isImageFormatSupported('custom-format', true);
    • Cleans up resources and disposes the plugin.

      Returns void

    • Removes and disposes the active paint layer. If no paint layer exists, this method does nothing.

      Returns void

    • The method is called when the GcImageViewer component is initialized.

      Parameters

      Returns void

    Properties

    Gets the image viewer instance. The image viewer instance.

    Plugin options

    filters: Record<string, ImageFilterDefinition>

    Gets available image filters.

    // Create Image Filters plugin:
    const imageFiltersPlugin = new ImageFiltersPlugin();
    // Remove the default image filters, except for the "Invert" filter:
    const filters = imageFiltersPlugin.filters;
    for(const filterName in filters) {
    if(filterName === "invert")
    continue;
    delete filters[filterName];
    }
    // Add custom Image Filter:
    filters["lemon-effect"] = {
    filterId: "lemon-effect",
    toolbarKey: "lemon-effect",
    title: "Apply Custom Lemon effect",
    text: "Apply Lemon effect",
    action: function(imageData) {
    for (i = 0; i < imageData.data.length; i += 4) {
    imageData.data[i + 1] = imageData.data[i] + 45; // increase green component
    }
    return imageData;
    }
    };
    // Register Image Filters plugin:
    viewer.addPlugin(imageFiltersPlugin);
    paintLayer: ImageLayer

    Gets the paint layer containing the HTML canvas for drawing the image.

    isReady: boolean

    Returns true if the image is loaded into the viewer and the image format is supported by the Image Filters plugin.

    naturalSize: Size

    Natural image size.

    Unique plug-in identifier.