Show the zero value when there is no data for the range of days displayed on the chartArea

[Roberto]

Hi,

Is it possible to show the zero value when there is no data for the date / day shown in the areaChart?

The points are only linked when there is data for the days, I would like the zero value to be shown when there is no data.

Attachment: imageAreaChart_7d83e881.zip

[Sriram Kiran Senthilkumar]

Hi Roberto, 

  

Greetings from Syncfusion. We have analyzed your query at our end, and we would like to share some information regarding the DateTimeAxis available in the chart. As the DateTimeAxis available in our chart widget is a linear axis i.e., the chart when gets rendered in a DateTime axis, then its axis labels will be in a calculated range interval (say from 11 Nov 2020 to 8 Dec 2020), the data points passed to the chart gets connected linearly along the axis and this is the default behavior of the DateTimeAxis.   

 

However, you can overcome this by passing null values as y-values for respective the date values where there is no or zero data. For example, in the provided chart screenshot, the values from 16 Nov 2020 to 20 Nov 2020 has no data so you need to pass the chart values with y-values as null for these date values in the chart data source list like in the below code snippet. 

SfCartesianChart( 

series: <ChartSeries<ChartData, DateTime>>[ 

              AreaSeries<ChartData, DateTime>( 

                  dataSource: <ChartData>[ 

                    ChartData(DateTime(2020, 11, 14), 0.9), 

                    ChartData(DateTime(2020, 11, 15), 4.7), 

                    // null y-values passed for date values where there is no data 

                    ChartData(DateTime(2020, 11, 16), null), 

                    ChartData(DateTime(2020, 11, 17), null), 

                    ChartData(DateTime(2020, 11, 18), null), 

                    ChartData(DateTime(2020, 11, 19), null), 

                    ChartData(DateTime(2020, 11, 20), null), 

                   ChartData(DateTime(2020, 11, 21), 4.5), 

                 ] 

              ) 

]) 

 

 

So, when the chart gets rendered the following points with null values will get ignored will not get plotted in the chart area and the points before and after the no data values will not get linked with each other. We have also created a simple sample and attached below in with we have rendered a chart similar to the chart in the provided screenshot along with providing null y-values for the date values where there is no data. 

Sample: https://www.syncfusion.com/downloads/support/forum/160447/ze/f160447_sample1230657558 

  

Please check with above sample and revert us if you still have further concerns. 

 

Also, to mention that, if you want to control the action to be taken for the empty points in the chart then you can use the EmptyPointsSettings feature available in the series. For further reference on the emptyPointsSettings property of the chart series, please refer the use guide below 

https://help.syncfusion.com/flutter/cartesian-charts/series-customization#empty-points 

  

Regards, 

Sriram Kiran