Document Solutions Image Viewer - v7.2.0 / ImageFiltersPlugin

Class: ImageFiltersPlugin

ImageFiltersPlugin class. Adds the "Image Filters" button.

Example

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

Param

Table of contents

Properties

• id
• options

Constructors

• constructor

Accessors

• filters
• isReady
• naturalSize

Methods

• confirmChanges
• cancelChanges
• undoTransactionStep
• redoTransactionStep
• applyFilter
• isImageFormatSupported

Properties

id

• Readonly id: string = "imageFilters"

Unique plugin identifier.

---

options

• options: ImageFiltersPluginOptions

Plugin options

Constructors

constructor

• new ImageFiltersPlugin(options?)

ImageFiltersPlugin constructor.

Parameters

Name	Type	Description
options?	ImageFiltersPluginOptions	plugin options

Accessors

filters

• get filters(): Object

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);

Returns

Object

---

isReady

• get isReady(): boolean

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

Returns

boolean

---

naturalSize

• get naturalSize(): Object

Natural image size.

Returns

Object

Name	Type
width	number
height	number

Methods

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>

---

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>

---

undoTransactionStep

▸ undoTransactionStep(): boolean | void

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

Returns

boolean | void

---

redoTransactionStep

▸ redoTransactionStep(): boolean | void

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

Returns

boolean | void

---

applyFilter

▸ applyFilter(filterName, intensity?): Promise<boolean>

Apply image filter.

Parameters

Name	Type
filterName	string
intensity?	number

Returns

Promise<boolean>

---

isImageFormatSupported

▸ isImageFormatSupported(imageFormat, allowUnknown?): boolean

Checks if the image format specified by the imageFormat parameter is supported.

Parameters

Name	Type
imageFormat	string | ImageFormatCode
allowUnknown?	boolean

Returns

boolean