# filter

The filter SVG element defines a custom filter effect by grouping atomic filter primitives. It is never rendered itself, but must be used by the filter attribute on SVG elements, or the filter CSS property for SVG/HTML elements.

This element implements the SVGFilterElement interface.

Usually, this element is create with:

const filter = parentElement.add('filter')

It's possible create as a disconnected element with gySVG('filter') and attach it to the SVG document with .attachTo().

More info: mdn (opens new window) | w3c (opens new window)

# .class()

filter.class( _ )

Set assigns a class name or set of class names to an element. You may assign the same class name or names to any number of elements, however, multiple class names must be separated by whitespace characters.

  • argument: {} _

  • returns: {gySVGObject} The original object

const class = element.class();

Get the class current value.

  • returns: {}

# .style()

filter.style( _ )

Set the style attribute allows to style an element using CSS declarations. It functions identically to the style attribute in HTML.

  • argument: {} _

  • returns: {gySVGObject} The original object

const style = element.style();

Get the style current value.

  • returns: {}

# .x()

filter.x( _ )

Set the x attribute defines a x-axis coordinate in the user coordinate system.

  • argument: {} _

  • returns: {gySVGObject} The original object

const x = element.x();

Get the x current value.

  • returns: {}

# .y()

filter.y( _ )

Set the y attribute defines a y-axis coordinate in the user coordinate system.

  • argument: {} _

  • returns: {gySVGObject} The original object

const y = element.y();

Get the y current value.

  • returns: {}

# .width()

filter.width( _ )

Set the width attribute defines the horizontal length of an element in the user coordinate system.

  • argument: {} _

  • returns: {gySVGObject} The original object

const width = element.width();

Get the width current value.

  • returns: {}

# .height()

filter.height( _ )

Set the height attribute defines the vertical length of an element in the user coordinate system.

  • argument: {} _

  • returns: {gySVGObject} The original object

const height = element.height();

Get the height current value.

  • returns: {}

# .filterUnits()

filter.filterUnits( _ )

Set the filterUnits attribute defines the coordinate system for the attributes x, y, width and height.

  • argument: {} _

  • returns: {gySVGObject} The original object

const filterUnits = element.filterUnits();

Get the filterUnits current value.

  • returns: {}

# .primitiveUnits()

filter.primitiveUnits( _ )

Set the primitiveUnits attribute specifies the coordinate system for the various length values within the filter primitives and for the attributes that define the filter primitive subregion.

  • argument: {} _

  • returns: {gySVGObject} The original object

const primitiveUnits = element.primitiveUnits();

Get the primitiveUnits current value.