Filter

Pixie currently ships with 18 lightning fast filters that use WebGL, if available, or canvas fallback otherwise and allows you to create custom filters.

var pixie = new Pixie({
    onLoad: function() {
        pixie.tools.filter.apply(filterTool.getByName('grayscale'));
    }
});

Showing only specific filters

To show only specific filters, specify names of the filters that should be shown using  items option and set replaceDefault to true.

var pixie = new Pixie({
    tools: {
        filter: {
            replaceDefault: true,
            items: ['brightness', 'noise', 'pixelate'],
        }
    }
})

Methods

apply

Apply specified filter to all images.

apply(filterName: string): void

remove

Remove specified filter from all images.

remove(filterName: string): void

getAll

Get a list of all available filters.

getAll(): FilterConfig[]

getByName

Get configuration for specified filter.

getByName(name: string): FilterConfig

isApplied

Check if specified filter is currently applied.

isApplied(name: string): boolean

applyValue

Change specified value for an active filter.

applyValue(filterName: string, optionName: string, optionValue: string | number): void

addCustom

Create a custom filter.

addCustom(name: string, filter: object, editableOptions?: FilterOptions, initialConfig?: object): void