# mask

The mask element defines an alpha mask for compositing the current object into the background. A mask is used/referenced using the mask property.

Usually, this element is create with:

const mask = parentElement.add('mask')

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

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

# .height()

mask.height( _ )

Set this attribute defines the height of the masking area.

  • argument: {} _

  • returns: {gySVGObject} The original object

const height = element.height();

Get the height current value.

  • returns: {}

# .maskContentUnits()

mask.maskContentUnits( _ )

Set this attribute defines the coordinate system for the contents of the mask.

  • argument: {} _

  • returns: {gySVGObject} The original object

const maskContentUnits = element.maskContentUnits();

Get the maskContentUnits current value.

  • returns: {}

# .maskUnits()

mask.maskUnits( _ )

Set this attribute defines defines the coordinate system for attributes x, y, width and height on the mask.

  • argument: {} _

  • returns: {gySVGObject} The original object

const maskUnits = element.maskUnits();

Get the maskUnits current value.

  • returns: {}

# .x()

mask.x( _ )

Set this attribute defines the x-axis coordinate of the top-left corner of the masking area.

  • argument: {} _

  • returns: {gySVGObject} The original object

const x = element.x();

Get the x current value.

  • returns: {}

# .y()

mask.y( _ )

Set this attribute defines the y-axis coordinate of the top-left corner of the masking area.

  • argument: {} _

  • returns: {gySVGObject} The original object

const y = element.y();

Get the y current value.

  • returns: {}

# .width()

mask.width( _ )

Set this attribute defines the width of the masking area.

  • argument: {} _

  • returns: {gySVGObject} The original object

const width = element.width();

Get the width current value.