# stop

The SVG stop element defines a color and its position to use on a gradient. This element is always a child of a linearGradient or radialGradient element.

Usually, this element is created with:

const stop = parentElement.add('stop')

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

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

# .stop-color()

stop.stop_color( color )

Set this attribute defines the color of the gradient stop. It can be used as a CSS property.

  • argument: {string} color The color value

  • returns: {gySVGObject} The original object

const stop_color = element.stop_color();

Get the stop-color current value.

  • returns: {string}

# .stop-opacity()

stop.stop_opacity( opacity )

Set this attribute defines the opacity of the gradient stop. It can be used as a CSS property.

  • argument: {number|string} opacity The opacity value

  • returns: {gySVGObject} The original object

const stop_opacity = element.stop_opacity();

Get the stop-opacity current value.