Class: grdnt

grdnt

Shortcut for creating SVG gradients

new grdnt(options){grdnt}

Initializes a new grdnt instance.
Name Type Description
options Object Options used to customize the grdnt
Name Type Default Description
parent * optional Preferably an SVGElement. When an HTMLElement is provided, a new SVGElement is appended to it, which becomes the parent for the grdnt.
id String optional The id of the instance. Auto-generated when not provided
type String grdnt.LINEAR optional The type of gradient to create. Can be grdnt.LINEAR or grdnt.RADIAL.
stops Array [] optional An array of objects containing stop element attributes. Used to initialize the stops for the gradient
attr Object optional Attributes to apply to the grdnt's gradient element.
css Object optional CSS Properties to apply to the grdnt's gradient element.
Returns:
Type Description
grdnt A new grdnt instance.

Requires

Members

readonlydefsSVGElement

The SVGDefsElement where the gradient is stored

readonlyelSVGElement

The gradient element associated with this instance

readonlyidString

The id of this instance's gradient element

readonlyparentSVGElement

The parent of the defs element

readonlysvgNodeList

A nodelist of the grdnt's stop elements

readonlyurlString

The url function string used to assign the gradient as a fill, stroke, etc

Methods

staticgrdnt.getElInstance(el){grdnt}

returns the grdnt instance associated with the provided element's id attribute
Name Type Description
el Element The element with the lookup id
Returns:
Type Description
grdnt The associate grdnt, if it exists

staticgrdnt.getInstance(id){grdnt}

returns the grdnt instance associated with the id
Name Type Description
id String The lookup id
Returns:
Type Description
grdnt The associate grdnt, if it exists

addStop(attr, index){SVGElement}

Updates the points attribute of the polygon element.
Name Type Description
attr Object Attributes to set on the stop element
Name Type Description
color Object Shortcut for 'stop-color'
alpha Object Shortcut for 'stop-opacity'
index int optional The insertion index, defaults to the number of stops. When negative, becomes the sum of itself and the number of stops
Returns:
Type Description
SVGElement The new stop element

getStop(index){SVGElement}

Returns the stop element at the specified index
Name Type Default Description
index int -1 optional The index of the target stop. When negative, becomes the sum of itself and the number of stops
Returns:
Type Description
SVGElement The stop element at the specified index

removeStop(index){SVGElement}

Removes the stop element at the specified index
Name Type Default Description
index int -1 optional The index of the target stop. When negative, becomes the sum of itself and the number of stops
Returns:
Type Description
SVGElement The stop element that was removed

setStop(attr, index){SVGElement}

Updates the stop element at the specified index
Name Type Default Description
attr Object Attributes to set on the stop element
Name Type Description
color Object Shortcut for 'stop-color'
alpha Object Shortcut for 'stop-opacity'
index int -1 optional The index of the target stop. When negative, becomes the sum of itself and the number of stops
Returns:
Type Description
SVGElement The updated stop element