new Vecta.linearGradient(grad)
Creates a new linear gradient or gets existing linear gradient.
| Name | Type | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
grad | string|object | A valid string id or reference url. Or, an object of necessary gradient element.
|
Examples:
var linear = new Vecta.linearGradient('L001001000ffe8e6100100ff8080100.grad'); //pass in string id to return existing linear gradient object
var linear = new Vecta.linearGradient('url(#L001001000ffe8e6100100ff8080100.grad)'); //pass in reference url to return existing linear gradient object
var linear = new Vecta.linearGradient({
angle: 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 linear gradient.
| Name | Type | Description |
|---|---|---|
stops | Object[] | An array of stops to add, in th form of |
Returns:
Returns Vecta.linearGradient object.
Examples:
var linear = new Vecta.linearGradient('L001001000ffe8e6100100ff8080100.grad');
console.log(linear.stops()); //[{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}]
linear.addStops([{"offset": "0%", "color": "#ff7070", "opacity": 1}]); //set stops for the linear gradient
console.log(linear.stops(1)); //[{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}, {"offset": "0%", "color": "#ff7070", "opacity": 1}].angle([angle]) Returns: number|Vecta.linearGradient
Get or set linear gradient's angle.
For set, angles are normalized to between 0 - 360 degrees.
If the provided angle is invalid, then the operation fails with an error message in console.
| Name | Type | Attributes | Description |
|---|---|---|---|
angle | number | optional | The angle to set in degrees, undefined if get. |
Returns:
Returns the linear gradient's angle if get or Vecta.linearGradient if set.
Examples:
var linear = new Vecta.linearGradient('L001001000ffe8e6100100ff8080100.grad');
linear.angle(45); //set angle to 45 degrees
console.log(linear.angle()); //45.length() Returns: number
Get the number of stops. Read only.
Returns:
The number of stops for the gradient
Examples:
var linear = new Vecta.linearGradient('L001001000ffe8e6100100ff8080100.grad');
console.log(linear.length()); //2.stops(index, [value]) Returns: Object
Get or set stops for linear 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.
|
Returns:
Returns the value object if get, or Vecta.linearGradient if set.
Examples:
var linear = new Vecta.linearGradient('L001001000ffe8e6100100ff8080100.grad');
linear.stops([{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}]); //set stops for the linear gradient
console.log(linear.stops()); //[{"offset": "0%", "color": "#ffe8e6", "opacity": 1}, {"offset": "100%", "color": "#ff8080", "opacity": 1}]
linear.stops(1, {"offset": "100%", "color": "#ff7070", "opacity": 1}); //set stop with index 1, i.e. the second stop
console.log(linear.stops(1)); //{"offset": "100%", "color": "#ff7070", "opacity": 1}.url() Returns: string
Get linear gradient reference url. Read only.
Returns:
Returns the gradient reference url.
Examples:
var linear = new Vecta.linearGradient('L001001000ffe8e6100100ff8080100.grad');
console.log(linear.url()); //'url(#L001001000ffe8e6100100ff8080100.grad)'