# Two.Gradient

Extends: Two.Element

This is the base class for constructing different types of gradients with Two.js. The two common gradients are Two.LinearGradient and Two.RadialGradient.

Source

# Constructor

Argument Description
stops A list of Two.Stops that contain the gradient fill pattern for the gradient.

# Stop

See: Two.Stop

gradient.js:78

# Properties

A list of properties that are on every Two.Gradient.

gradient.js:84

# renderer

Object access to store relevant renderer specific variables. Warning: manipulating this object can create unintended consequences.

gradient.js:35

nota-bene

With the Two.SVGRenderer you can access the underlying SVG element created via shape.renderer.elem.

# id

Session specific unique identifier.

gradient.js:42

nota-bene

In the Two.SVGRenderer change this to change the underlying SVG element's id too.

# spread

Indicates what happens if the gradient starts or ends inside the bounds of the target rectangle. Possible values are 'pad', 'reflect', and 'repeat'.

See: https://www.w3.org/TR/SVG11/pservers.html#LinearGradientElementSpreadMethodAttribute (opens new window) for more information

gradient.js:54

# units

Indicates how coordinate values are interpreted by the renderer. Possible values are 'userSpaceOnUse' and 'objectBoundingBox'.

See: https://www.w3.org/TR/SVG11/pservers.html#RadialGradientElementGradientUnitsAttribute (opens new window) for more information

gradient.js:61

# stops

An ordered list of Two.Stops for rendering the gradient.

gradient.js:68

# clone

Returns: Two.Gradient

Argument Description
parent The parent group or scene to add the clone to.

Create a new instance of Two.Gradient with the same properties of the current path.

gradient.js:90

# toObject

Returns: Object

Return a JSON compatible plain object that represents the path.

gradient.js:117

← Two.LinearGradient →