radialGradient

Vecta.radialGradient

new Vecta.radialGradient(grad)

Creates a new radial gradient or gets existing radial gradient.

Name Type Description

grad

string|object

A valid string id or reference url. Or, an object of necessary gradient element.

Name	Type	Attributes	Description
`radius`	object	`optional`	The radius for radial gradient
`stops`	object	`optional`	The stops for radial gradient

Examples:

var radial = new Vecta.radialGradient('R50505050500000000100100ff8080100.grad'); //pass in string id to return existing radial gradient object
var radial = new Vecta.radialGradient('url(#R50505050500000000100100ff8080100.grad)'); //pass in reference url to return existing radial gradient object
var radial = new Vecta.radialGradient({
        	radius: 90,
        	stops: [{color: '#bfbfbf'},{color: '#595959'}]
    	}); //pass in object with necessary gradient element to find existing or creates new linear gradient object

Methods

.addStops(stops) Returns: Object

Add stops to radial gradient.

Name	Type	Description
`stops`	Object[]	An array of stops to add, in th form of `{offset: string, color: string, opacity: number}[]`.

Returns:

Returns Vecta.radialGradient object.

Examples:

var radial = new Vecta.radialGradient('R50505050500000000100100ff8080100.grad');

console.log(radial.stops()); //[{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}]
radial.addStops([{"offset": "0%", "color": "#ff7070", "opacity": 1}]); //set stops for the radial gradient
console.log(radial.stops(1)); //[{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}, {"offset": "0%", "color": "#ff7070", "opacity": 1}]

.length() Returns: number

Get the number of stops. Read only.

Returns:

The number of stops for the gradient

Examples:

var radial = new Vecta.radialGradient('R50505050500000000100100ff8080100.grad');

console.log(radial.length()); //2

.radius(radius) Returns: Number|Object

Get or set the radius of radial gradient.

Name	Type	Description
`radius`	Number	value to set, undefined to get.

Returns:

Returns the radius when get, or Vecta.radialGradient if set.

Examples:

var radial = new Vecta.radialGradient('R50505050500000000100100ff8080100.grad');

radial.radius(60);
console.log(radial.radius()); //60

.stops(index, [value]) Returns: Object

Get or set stops for radial gradients.

Name Type Attributes Description

index

number

The stop index to get.

value

Object

optional

Undefined to get, null to remove or value object to set, as below.

Name	Type	Attributes	Description
`offset`	string	`optional`	Gradient stop offset
`color`	string	`optional`	Gradient stop color
`opacity`	number	`optional`	Gradient stop opacity

Returns:

Returns the value object if get, or Vecta.radialGradient if set.

Examples:

var radial = new Vecta.radialGradient('R50505050500000000100100ff8080100.grad');

radial.stops([{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}]); //set stops for the radial gradient
console.log(radial.stops()); //[{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}]

radial.stops(1, {"offset": "100%", "color": "#ff7070", "opacity": 1}); //set stop with index 1, i.e. the second stop
console.log(radial.stops(1)); //{"offset": "100%", "color": "#ff7070", "opacity": 1}

.url() Returns: string

Get radial gradient reference url. Read only.

Returns:

Returns the gradient reference url.

Examples:

var radial = new Vecta.radialGradient('R50505050500000000100100ff8080100.grad');

console.log(radial.url()); //'url(#R50505050500000000100100ff8080100.grad)'