Help me get desired style for charts

[Yudhisthir Singh Rajawat]

Hi SyncFusion team,

I am trying to have charts which look like the attachment that I am adding here https://ibb.co/qB09b2X.

Please help me attain the desired design as I am not able to modify the look and feel of charts as such.

The main must needed help would be to explain how can I make the white border of charts go away, custom styled (Coloured) gridlines.

Code attachment would be highly appreciated.

Thanks.

[Sriram Kiran Senthilkumar]

Hi Yudhisthir, 

 

Greetings from Syncfusion. Kindly find the repose to your queries below.
  

Query #1: Sample for provided image 

We have analyzed and created a sample according to the provided image. Please refer the below sample to achieve it. 

Sample:  https://www.syncfusion.com/downloads/support/forum/153557/ze/sample674564427 

Query #2: Eliminate white border of chart 

The white border of the chart can be eliminated by providing the value for plotAreaBorderWidth property as 0. 

 

Query #3: Custom colored gridlines 

As of now, customized gridline support is not available with chart. However, you can achieve it by using the Plotband feature of the axis. For further reference on plotband, please refer the user guide below. And using this plotband, we have achieved your requirement with the above sample.
 

https://help.syncfusion.com/flutter/sfcartesianchart/axis-customization#plot-bands 

  

Thanks, 

Sriram Kiran.