Extra unwanted label on datetime Axis is showing

Hi,

I am using DateTime Axis and making a monthly chart with data being pulled from a database. I am showing the monthly data, but the year of that data is appearing on the left. I want to remove this year so that all the months on the axis can show properly, because currently the year showing, is 2020 and shifts the jan label so that feb doesnt show. Any help is appreciated thanks. (Let me know if any clarification is needed). Please see image for the error im trying to explain.

SfCartesianChart(
plotAreaBorderWidth: 0,
trackballBehavior: TrackballBehavior(
activationMode: ActivationMode.singleTap,
enable: true,
shouldAlwaysShow: true,
markerSettings: TrackballMarkerSettings(
markerVisibility: TrackballVisibilityMode.visible,
color: Color(0xFF030AC4),
borderColor: Color(0xFF030AC4),
),
tooltipSettings: const InteractiveTooltip(
enable: true,
color: Colors.grey,
borderColor: Colors.grey,
decimalPlaces: 5,
),
),
primaryXAxis: DateTimeAxis(
intervalType: DateTimeIntervalType.months,
interval: 1,
),
primaryYAxis: NumericAxis(
decimalPlaces: 5,
rangePadding: ChartRangePadding.round,
maximum: 0.0011,
),
series: <AreaSeries<PriceData, DateTime>>[
AreaSeries<PriceData, DateTime>(
borderDrawMode: BorderDrawMode.top,
borderColor: Colour.kPrimaryColor,
borderWidth: 2,
gradient: gradientColors,
color: Color(0xFF030AC4),
dataSource: widget.list,
xValueMapper: (PriceData price, _) => price.day,
yValueMapper: (PriceData price, _) => price.value,
)
]
)

where the list being used is: 


List<PriceData> priceDataList = [
PriceData(DateTime(2020, 1, 1), 0.0001),
PriceData(DateTime(2020, 1, 2), 0.0002),
PriceData(DateTime(2020, 1, 3), 0.0003),
PriceData(DateTime(2020, 1, 4), 0.0004),
PriceData(DateTime(2020, 1, 5), 0.0005),
/// etc...
];

Attachment: tempFileForShare_20220914141324_(2)_1b955159.zip

3 Replies

SK Sriram Kiran Senthilkumar Syncfusion Team September 15, 2022 06:39 AM UTC

Hi Alvin,


Greetings from Syncfusion.

We have checked your query at our end and we would like to let you know that you can provide date format for the DateTimeAxis labels using the dateFormat property to show the months alone in abbreviated format. We have also modified your sample by setting dateFormat for the DateTimeAxis as DateFormat.MMM() and attached it below for reference.

Chart, line chart

Description automatically generated

Please check and get back to us if you require further assistance.


Regards,

Sriram Kiran


Attachment: f177511_81cfefe3.zip


AL Alvin Lam September 17, 2022 09:36 AM UTC

Hi Sriram,

Thanks for your help!

Alvin



SK Sriram Kiran Senthilkumar Syncfusion Team September 19, 2022 04:21 AM UTC

Hi Alvin,


Most welcome. Kindly get back to us if you have further queries. We are always happy to assist you.

Note: If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Regards,

Sriram Kiran


Loader.
Up arrow icon