ImageFiltersPlugin
Class: ImageFiltersPlugin
Image Filters Plugin. Adds the "Image Filters" button.
Example
<script src="gcimageviewer.js"></script></head>
<script src="plugins/imageFilters.js"></script>
<script>
const viewer = new GcImageViewer("#root");
viewer.addPlugin(new ImageFiltersPlugin());
</script>
Properties
filters
filters: Record<string, ImageFilterDefinition>;
Gets available image filters.
Example
// 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);
Implementation of
ImageFiltersPluginAPI.filters
id
id: PluginType;
Unique plug-in identifier.
Implementation of
ImageFiltersPluginAPI.id
isReady
isReady: boolean;
Returns true if the image is loaded into the viewer and the image format is supported by the Image Filters plugin.
Implementation of
ImageFiltersPluginAPI.isReady
naturalSize
naturalSize: Size;
Natural image size.
Implementation of
ImageFiltersPluginAPI.naturalSize
options
options: ImageFiltersPluginOptions;
Plugin options
Implementation of
ImageFiltersPluginAPI.options
paintLayer
paintLayer: ImageLayer;
Gets the paint layer containing the HTML canvas for drawing the image.
Implementation of
ImageFiltersPluginAPI.paintLayer
viewer
viewer: ImageViewerAPI;
Gets the image viewer instance. The image viewer instance.
Implementation of
ImageFiltersPluginAPI.viewer
Methods
applyFilter()
applyFilter(filterName, intensity?): Promise<boolean>;
Apply image filter.
Parameters
filterName
string
Filter name to apply.
intensity?
number
Filter intensity.
Returns
Promise<boolean>
True if filter was applied successfully.
Implementation of
ImageFiltersPluginAPI.applyFilter
cancelChanges()
cancelChanges(): 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>
Implementation of
ImageFiltersPluginAPI.cancelChanges
confirmChanges()
confirmChanges(): boolean | void | Promise<boolean | void>;
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>
Implementation of
ImageFiltersPluginAPI.confirmChanges
dispose()
dispose(): void;
Cleans up resources and disposes the plugin.
Returns
void
Implementation of
ImageFiltersPluginAPI.dispose
initialize()
initialize(viewer): void;
The method is called when the GcImageViewer component is initialized.
Parameters
viewer
Returns
void
Implementation of
ImageFiltersPluginAPI.initialize
isImageFormatSupported()
isImageFormatSupported(imageFormat, allowUnknown?): boolean;
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.
allowUnknown?
boolean
If true, allows unknown formats (ImageFormatCode.Default) to be considered supported.
Returns
boolean
True if the format is supported for modifications, false otherwise.
Remarks
The following formats are explicitly not supported:
- TIFF (ImageFormatCode.TIFF)
- SVG (ImageFormatCode.SVG)
- ICO (ImageFormatCode.ICO)
- GIF (ImageFormatCode.GIF)
Examples
// 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);
Implementation of
ImageFiltersPluginAPI.isImageFormatSupported
redoTransactionStep()
redoTransactionStep(): boolean | void;
Redo viewer transaction step. Return true if redo operation is consumed.
Returns
boolean | void
Implementation of
ImageFiltersPluginAPI.redoTransactionStep
removePaintLayer()
removePaintLayer(): void;
Removes and disposes the active paint layer. If no paint layer exists, this method does nothing.
Returns
void
Implementation of
ImageFiltersPluginAPI.removePaintLayer
undoTransactionStep()
undoTransactionStep(): boolean | void;
Undo viewer transaction step. Return true if undo operation is consumed.
Returns
boolean | void
Implementation of
ImageFiltersPluginAPI.undoTransactionStep