Class ChartRadialGradient
Represents options to configure a radial gradient for a chart ChartSeries, or ChartTrendline within the SfChart component.
Implements
System.IAsyncDisposable
Inherited Members
Namespace: Syncfusion.Blazor.Toolkit.Charts
Assembly: Syncfusion.Blazor.Toolkit.dll
Syntax
public class ChartRadialGradient : RadialGradient, IAsyncDisposable, IChartElement, ISubcomponentTracker
Remarks
ChartRadialGradient is a child component that inherits from RadialGradient. Set the center with Cx and Cy, the focal point with Fx and Fy, and the radius with R. Define color transitions using ChartGradientColorStops containing one or more ChartGradientColorStop elements.
Coordinates are typically normalized to 0..1 relative to the gradient box; (0.5, 0.5) centers the gradient, and R="0.5"
covers roughly half the box.
When placed under ChartSeries, or ChartTrendline, the gradient is applied automatically.
Examples
@using Syncfusion.Blazor.Toolkit.Charts
<SfChart>
<ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Toolkit.ValueType.Category" />
<ChartSeries Name="Series1"
Type="ChartSeriesType.Line"
DataSource="@Data"
XName="Month"
YName="Value">
<ChartRadialGradient Cx="0.5" Cy="0.5" Fx="0.5" Fy="0.5" R="0.4">
<ChartGradientColorStops>
<ChartGradientColorStop Offset="0" Color="#EE4256" Opacity="1" />
<ChartGradientColorStop Offset="100" Color="#6D83B8" Opacity="1" />
</ChartGradientColorStops>
</ChartRadialGradient>
</ChartSeries>
</SfChart>
@code {
public class Point { public string Month { get; set; } = ""; public double Value { get; set; } }
public List<Point> Data = new()
{
new() { Month = "Jan", Value = 35 },
new() { Month = "Feb", Value = 28 },
new() { Month = "Mar", Value = 34 },
};
}
Constructors
ChartRadialGradient()
Declaration
public ChartRadialGradient()
Implements
System.IAsyncDisposable