We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Need a column to display for each item in List

I have a chart as per below:

<SfChart Width="100%" >

    <ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Category"></ChartPrimaryXAxis>

    <ChartSeriesCollection>

        <ChartSeries DataSource="@ChartItems" XName="Area" YName="Uar" Type="ChartSeriesType.Column">

        </ChartSeries>

    </ChartSeriesCollection>

</SfChart>


@ChartItems is a list of SchemeGraphItem:

    public class SchemeGraphItem

    {

        public decimal? Uar { get; set; }

        public float? Area { get; set; }

        public string? Uarn { get; set; }

    }

This list can have many items with either the same or different Uar and/or Area - eg:

{ Uar = 100, Area = 50, Uarn = 12345 },

{ Uar = 110, Area = 50, Uarn = 12346 },

{ Uar = 150, Area = 45, Uarn = 12347 },

{ Uar = 150, Area = 40, Uarn = 12348 },

{ Uar = 150, Area = 40, Uarn = 12349 },

{ Uar = 150, Area = 40, Uarn = 12340 }


I would want to see a column for each item.  Currently, these are getting collated and there is not a column for each record.

Please could you advise?

Thanks, Gar


3 Replies 1 reply marked as answer

GV Gopalakrishnan Veeraraghavan Syncfusion Team April 19, 2023 10:56 AM UTC

Hi Gary,


We have analyzed your query. We suggest setting IsIndexed to true in the ChartPrimaryXAxis property to split the column chart points. We have attached a sample and screenshot for your reference. Please check with the below code snippet.



<SfChart Width="100%">

 

    <ChartPrimaryXAxis IsIndexed="true" ValueType="Syncfusion.Blazor.Charts.ValueType.Category"></ChartPrimaryXAxis>

 

    <ChartSeriesCollection>

 

        <ChartSeries DataSource="@ChartItems" XName="Area" YName="Uar" Type="ChartSeriesType.Column">

 

        </ChartSeries>

 

    </ChartSeriesCollection>

 

</SfChart>


Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SplitColumnChart1538004592.zip


Screenshot:

Chart, bar chart

Description automatically generated


UG: https://blazor.syncfusion.com/documentation/chart/category-axis#indexed-category-axis


Kindly revert us if you have any other concerns.


Regards,

Gopalakrishnan Veeraraghavan


Marked as answer

GA Gary April 19, 2023 11:38 AM UTC

Thanks, that worked perfectly.


Is it possible to always have the Y Axis start at 0?


Screenshot 2023-04-19 123549.png



GV Gopalakrishnan Veeraraghavan Syncfusion Team April 20, 2023 12:11 PM UTC

Hi Gary,


To start the Y-axis values from zero, we suggest setting StartFromZero to true in the ChartPrimaryYAxis property. Alternatively, you can set the Minimum property to zero in the ChartPrimaryYAxis property. We have attached a sample and screenshot for your reference. Please check with the below code snippet.



<SfChart Width="100%">

 

    <ChartPrimaryYAxis StartFromZero="true"></ChartPrimaryYAxis>

 

</SfChart>


<SfChart Width="100%">

 

    <ChartPrimaryYAxis Minimum="0"></ChartPrimaryYAxis>

 

</SfChart>


Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SplitColumnChart_2-718596979.zip


Screenshot:

Chart, bar chart

Description automatically generated


UG: https://blazor.syncfusion.com/documentation/chart/numeric-axis#range-and-interval


Kindly revert us if you have any other concerns.


Regards,

Gopalakrishnan Veeraraghavan



Loader.
Up arrow icon