chart has extra padding


Hi, 

I'm working with SplineAreaSeries of SfCartesianChart.

I have an area chart which gets rendered within a card widget.

I have  set the plotAreaBorderWidth and margin property of the SfCartesian chart to be 0 in order to render the chart without spaces.

Here is the intended card view:


However, when I render the chart there seems to be spacing within the chart (x-axis) like this:

To see it more clearly, showing primaryXAxis turn out to be:

You can see that although the minimum value of x is 0 and maximum is 15, the chart gets rendered with extra space before and after the ticks. (ignore the last y value, as y value is null for this)

when I use ColumnSeries, the graph seems to almost render correctly to minimum and maximum value (but there is very very little space):


Is there any property that I can set so that the chart gets rendered matching the size of the card without any extra space on the right/left?

Here is my code for SfCartesianChart:


SfCartesianChart(
plotAreaBorderWidth: 0,
margin: EdgeInsets.zero,
primaryXAxis: CategoryAxis(isVisible: false,),
primaryYAxis: NumericAxis(isVisible: false,),
series: <ColumnSeries<SetData, String>>[
ColumnSeries<SetData, String>(
...some columnseries properties
),
]
),


Thank you.


1 Reply 1 reply marked as answer

SK Sriram Kiran Senthilkumar Syncfusion Team July 6, 2021 03:32 PM UTC

Hi Jaehwi Kim, 
  
We have analyzed your scenario with the provided screenshots and code. We suspect that you have used the category axis, and with this axis, the by default the axis labels will be placed between ticks. In your case, you can position the labels on the ticks. To accomplish this, use the below code. 
  
primaryXAxis: CategoryAxis( labelPlacement: LabelPlacement.onTicks ), 
  
Also ensure, whether for the parent widget of the cartesian chart widget has some margins, if so, your case will get replicated. If so, please remove them. If you still face any concerns, kindly get back to us with the attached sample. 
  
  
Thanks, 
Sriram Kiran. 


Marked as answer
Loader.
Up arrow icon