Vertical stripline on a DateTime axis

[Costas]

Hi all,

I have a blazor chart with a DateTime axis with "dd/MM/yy HH:mm" as the label format.  I have a separate array that contains time periods (as start/end DateTime pairs)  and for each of those I'd like to place a stripline on the chart.  I have followed the various examples but to no avail. Any help?

Thanks,

Costas

[Srihari Muthukaruppan]

Hi Costas, 

 

We are analyzing your query. We will update the status within two business day(April 27 2021). We appreciate your patience until then. 

 

Regards, 

Srihari M 

[Srihari Muthukaruppan]

Hi Costas, 

  

We have analyzed your query. Based on that, we would like to let you know that we can add striplines using ChartStriplines tag. We have also attached our UG link and demo sample link for your reference. Similarly we can provide start and end values as dateTime to achieve your requirement as shown in the below code snippet. Please find the UG and demo link below. 

  

UG        : https://blazor.syncfusion.com/documentation/chart/strip-line/#customize-the-strip-line 

  

Demo  : https://blazor.syncfusion.com/demos/chart/strip-line?theme=bootstrap4 

  

Code snippet: 

// add your additional code here 

  

<ChartPrimaryXAxis StripLines="@striplines" LabelFormat="dd/MM/yy HH:mm" EdgeLabelPlacement="EdgeLabelPlacement.Shift" ValueType="Syncfusion.Blazor.Charts.ValueType.DateTime"> 

        <ChartAxisMajorGridLines Width="0"></ChartAxisMajorGridLines> 

        <ChartStriplines> 

            <ChartStripline Start="new DateTime(1970, 1, 1, 2, 10, 00)" End=" new DateTime(1970, 1, 1, 3, 20, 00)" Color="#ff512f" Visible="true"> 

                <ChartStriplineTextStyle Size="18px" Color="#ffffff" FontWeight="600"></ChartStriplineTextStyle> 

                <ChartStriplineBorder Width="0"></ChartStriplineBorder> 

            </ChartStripline> 

            <ChartStripline Start="new DateTime(1970, 1, 1, 5, 10, 00)" End=" new DateTime(1970, 1, 1, 6, 20, 00)" Color="#ff512f" Visible="true"> 

                <ChartStriplineTextStyle Size="18px" Color="#ffffff" FontWeight="600"></ChartStriplineTextStyle> 

                <ChartStriplineBorder Width="0"></ChartStriplineBorder> 

            </ChartStripline> 

        </ChartStriplines> 

    </ChartPrimaryXAxis> 

  

// add your additional code here 

  

  

If still this is not your exact requirement kindly share more details such as screenshots or code snippets regarding the requirement which will be helpful for further analysis and provide you solution sooner 

  

Regards, 

Srihari M