alexa
menu

Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Search Results for

    Show / Hide Table of Contents

    Class ChartLinearGradient

    Provides options to configure a linear gradient for a chart ChartSeries, technical ChartIndicator, or ChartTrendline within the SfChart component.

    Inheritance
    object
    ComponentBase
    OwningComponentBase
    SfOwningComponentBase
    ChartSubComponent
    LinearGradient
    ChartLinearGradient
    Implements
    IComponent
    IHandleEvent
    IHandleAfterRender
    IDisposable
    Inherited Members
    ComponentBase.Assets
    ComponentBase.AssignedRenderMode
    ComponentBase.BuildRenderTree(RenderTreeBuilder)
    ComponentBase.DispatchExceptionAsync(Exception)
    ComponentBase.InvokeAsync(Action)
    ComponentBase.InvokeAsync(Func<Task>)
    ComponentBase.OnAfterRender(bool)
    ComponentBase.OnAfterRenderAsync(bool)
    ComponentBase.OnInitialized()
    ComponentBase.OnInitializedAsync()
    ComponentBase.OnParametersSet()
    ComponentBase.OnParametersSetAsync()
    ComponentBase.RendererInfo
    ComponentBase.SetParametersAsync(ParameterView)
    ComponentBase.ShouldRender()
    ComponentBase.StateHasChanged()
    LinearGradient.X1
    LinearGradient.X2
    LinearGradient.Y1
    LinearGradient.Y2
    object.Equals(object)
    object.Equals(object, object)
    object.GetHashCode()
    object.GetType()
    object.MemberwiseClone()
    object.ReferenceEquals(object, object)
    object.ToString()
    OwningComponentBase.Dispose(bool)
    OwningComponentBase.IsDisposed
    OwningComponentBase.ScopedServices
    Namespace: Syncfusion.Blazor.Charts
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class ChartLinearGradient : LinearGradient, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
    Remarks

    ChartLinearGradient is a child component that inherits from LinearGradient. Use X1, Y1, X2, and Y2 to set the gradient direction, and define color transitions using ChartGradientColorStops with one or more ChartGradientColorStop elements.

    Coordinate values are typically normalized to the range 0..1 relative to the paint box, where (0,0) is the top-left and (1,1) is the bottom-right. Gradient stop Offset commonly supports normalized 0..1 or percentage 0..100 values.

    When nested under ChartSeries, ChartIndicator, or ChartTrendline, the gradient is applied automatically to the owning element.

    Examples
    @using Syncfusion.Blazor.Charts
    
    <SfChart>
        <ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Category" />
        <ChartSeriesCollection>
            <ChartSeries Type="ChartSeriesType.Line"
                        DataSource="@Data"
                        XName="Month"
                        YName="Value"
                        Name="Sales">
                <ChartLinearGradient X1="0" Y1="0" X2="0" Y2="1">
                    <ChartGradientColorStops>
                        <ChartGradientColorStop Offset="0"   Color="#4F46E5" Opacity="1" />
                        <ChartGradientColorStop Offset="100" Color="#22D3EE" Opacity="1" />
                    </ChartGradientColorStops>
                </ChartLinearGradient>
            </ChartSeries>
        </ChartSeriesCollection>
    </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

    ChartLinearGradient()

    Declaration
    public ChartLinearGradient()

    Implements

    IComponent
    IHandleEvent
    IHandleAfterRender
    IDisposable
    In this article
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved