Using the Category Axis with DateTime Axis types

[Vladimir Melnik]

Hello,

I would like to customize my chart that the YAxis has ValueType=Category and the XAxis is ValueType=DateTime. And I want to have Diamonds as a CharMarker in ChartSeries. Unfortunately I didn't manage to customize like this. Is there a possibility to achieve this look?

Best regards,

Volodymyr

[Srihari Muthukaruppan]

Hi Vladimir, 

  

We could achieve the Diamond shape marker using the Shape property in the ChartMarker. And regarding yAxis value in category we would like to let you know that by default yAxis accepts only double value. Hence we request you to use OnAxisLabelRender event to customize axis labels based on your need. We have attached sample and screenshot for your reference.  

  

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/AxisLabelAndMarker-1745653975.zip 

  

Code Snippet: 

<SfChart Theme="@Theme"> 

    <ChartEvents OnAxisLabelRender="AxisLabelRender" Loaded="Loaded"></ChartEvents> 

    // add your additional code here 

    <ChartPrimaryYAxis  LabelFormat="{value}%" RangePadding="ChartRangePadding.None" Minimum="0" Maximum="100" Interval="20"> 

    </ChartPrimaryYAxis> 

    <ChartSeriesCollection> 

        <ChartSeries DataSource="@ChartData" Name="Germany" XName="Period" Width="2" 

                     Opacity="1" YName="ENG_InflationRate" Type="ChartSeriesType.Line"> 

            <ChartMarker Shape="ChartShape.Diamond" Fill="#ffffd9" Visible="true" Width="10" Height="10"> 

                <ChartMarkerBorder Color="black" Width="2"></ChartMarkerBorder> 

            </ChartMarker> 

        </ChartSeries> 

        <ChartSeries DataSource="@ChartData" Name="England" XName="Period" Width="2" 

                     Opacity="1" YName="GER_InflationRate" Type="ChartSeriesType.Line"> 

            <ChartMarker Shape="ChartShape.Diamond" Fill="#1d8cbe" Visible="true" Width="10" Height="10"> 

                <ChartMarkerBorder Color="black" Width="2"></ChartMarkerBorder> 

            </ChartMarker> 

        </ChartSeries> 

    </ChartSeriesCollection> 

</SfChart> 

  

// add your additional code here 

  

public string[] Labels = new string[] { "Label1", "Label2", "Label3", "Label4", "Label5", "Label6" }; 

public void AxisLabelRender(AxisLabelRenderEventArgs args) 

    { 

        if (args.Axis.Name == "PrimaryYAxis") 

        { 

            args.Text = Labels[Count]; 

            Count++; 

            Count = (Count < 6) ? Count : 0; 

        } 

    } 

  

// add your additional code here 

  

Screenshot: 

 

  

As of now we are facing issue in AxisLabelRender event of the chart which triggers multiple times. We have also logged a bug request on this. You can keep track of it from the below feedback portal link.  

  

Feedback Link: https://www.syncfusion.com/feedback/24521/axislabelrender-event-triggers-multiple-times-in-chart 

  

This fix will be available in our volume 1 sp1 release which is scheduled to be rolled out by the mid of May 2021. We appreciate your patience until then   

  

Regards,   

Srihari M 

[Vladimir Melnik]

Hello Srihari,

thanks for your reply. It was helpfull.

Kind regards,

Volodymyr

[Srihari Muthukaruppan]

Hi Vladimir, 

 

Most welcome. 

 

We will let you know once the fix has been rolled out in our sp1 release. We appreciate your patience until then.   

   

Regards,   

Srihari 

[Srihari Muthukaruppan]

Hi Vladimir, 

  

We are glad to announce that our v19.1.63 patch release is rolled out, we have added the fix for the OnAxisLabelRender event triggered multiple times issue. And you can use the latest (19.1.63) Syncfusion.EJ2.Blazor NuGet package version to get rid of the scenario. 

  

Release Notes: https://blazor.syncfusion.com/documentation/release-notes/19.1.63/?type=all 

  

We appreciate your patience in waiting for this release. Kindly let us know if you need further assistance. 

  

Regards, 

Srihari