VegaRise.NET
HomeAPI Reference
Back to DOM

GradientClass

Definition

Namespace
DOM.Elements.Graphics.Colors
Assembly
DOM.dll

Represents a gradient fill in the Vega DOM, allowing for color transitions and shading effects.

Remarks

A is composed of one or more instances plus either a linear shade () or a path-based shade (). The two shade types are mutually exclusive; consumers should choose one. Gradient GradientStop LinearShade PathShade Gradients are typically attached to a or a . Fill.GradientFill TextEffect.GradientFill

Examples

csharp
1// 1. Two-stop red → yellow gradient
2var gradient = new Gradient
3{
4 GradientStops = new List<IGradientStop>
5 {
6 new GradientStop { StopColor = Color.Red, StopPosition = 0 },
7 new GradientStop { StopColor = Color.Yellow, StopPosition = 100 }
8 },
9 LinearShade = new LinearShade { Angle = 45, Scaled = true }
10};
11
csharp
1// 2. Three-stop gradient
2var gradient = new Gradient
3{
4 GradientStops = new List<IGradientStop>
5 {
6 new GradientStop { StopColor = Color.Red, StopPosition = 0 },
7 new GradientStop { StopColor = Color.Yellow, StopPosition = 50 },
8 new GradientStop { StopColor = Color.Green, StopPosition = 100 }
9 },
10 LinearShade = new LinearShade { Angle = 90 }
11};
12
csharp
1// 3. Path (radial) gradient
2var gradient = new Gradient
3{
4 GradientStops = new List<IGradientStop>
5 {
6 new GradientStop { StopColor = Color.White, StopPosition = 0 },
7 new GradientStop { StopColor = Color.Blue, StopPosition = 100 }
8 },
9 PathShade = new PathShade { PathShadeType = PathShadeTypeValues.circle }
10};
11
csharp
1// 4. Gradient that rotates with the shape
2var gradient = new Gradient
3{
4 GradientStops = new List<IGradientStop> { /* ... */ },
5 LinearShade = new LinearShade { Angle = 0 },
6 RotateWithShape = true
7};
8
csharp
1// 5. Fill text with a gradient
2var style = new TextStyle
3{
4 TextEffect = new TextEffect { GradientFill = gradient }
5};
6

Properties

GradientStopsIGradientStop

Gets or sets the ordered list of color stops that define the gradient.

Stops should be ordered by increasing ; the gradient interpolates between them. StopPosition

LinearShadeILinearShade

Gets or sets the linear shade configuration for the gradient fill.

PathShadeIPathShade

Gets or sets the path shade configuration for the gradient fill.

RotateWithShape

Gets or sets a value indicating whether the gradient should rotate with the shape it is applied to.