Search results

Vertical Chart

You can draw a chart in vertical manner by changing orientation of the axis. All series types support this feature. You can use IsTransposed property in chart to render a chart in vertical manner.

vertical.razor
@using Syncfusion.EJ2.Blazor.Charts

<EjsChart IsTransposed="true" Width="60%">
        <ChartSeriesCollection>
            <ChartSeries DataSource="@SalesReports" XName="X" YName="Y" Type="ChartSeriesType.Spline">
            </ChartSeries>
        </ChartSeriesCollection>
</EjsChart>

@code{
    public class ChartData
    {
        public double X;
        public double Y;
    }

    public List<ChartData> SalesReports = new List<ChartData> 
    {
        new ChartData{ X= 2005, Y= 28 },
        new ChartData{ X= 2006, Y= 25 },
        new ChartData{ X= 2007, Y= 26 },
        new ChartData{ X= 2008, Y= 27 },
        new ChartData{ X= 2009, Y= 32 },
        new ChartData{ X= 2010, Y= 35 },
        new ChartData{ X= 2011, Y= 30 }
    };
}

Pareto chart

See Also