0

I am using syncfusion charts where I need to display the Y axis in compact format. Syncfusion by default offers a parameter in NumberFormat from intl to allow formatting. But the compact number symbols used in the library is below,

COMPACT_DECIMAL_SHORT_PATTERN: const {
    3: '0T',
    4: '00T',
    5: '0L',
    6: '00L',
    7: '0Cr',
    8: '00Cr',
    9: '000Cr',
    10: '0TCr',
    11: '00TCr',
    12: '0LCr',
    13: '00LCr',
    14: '000LCr',
  }

Here thousand is displayed as T, but I need to convert it to K, I can't directly edit this file where the symbols are entered, because the deployment is happening via a CI/CD pipeline which download its own pub cache on each deployment. I can add a process to replace the symbols file with a modified file as part of the pipeline, but I don't know if it's a good practice, or what problems may arise over that.

I was thinking of including the entire intl inside the lib, and work it out, the task by itself seems too complicated, even if I did, I need to clone and modify the syncfusion also. cuz, as it requires the intl from pub cache.

Valeriia
  • 586
  • 2
  • 4
  • 21
  • You could supply your own number format to `NumericalAxis`. See https://github.com/syncfusion/flutter-widgets/blob/master/packages/syncfusion_flutter_charts/lib/src/chart/axis/numeric_axis.dart – Richard Heap Aug 02 '23 at 16:49
  • Be aware that the SyncFusion products in the Dart/Flutter pub are *not* open source. They are released under a commercial license that may subject you or your organization to a financial liability, and will affect downstream re-users of your code. – Randal Schwartz Aug 03 '23 at 06:09

2 Answers2

0

Numeric Axis constructor has an option to fromat the axis, axisLablelFormatter,

      axisLabelFormatter: (AxisLabelRenderDetails args) {
        NumberFormat numberFormat;
        if (args.value < 100000) {
          numberFormat = NumberFormat.compact();
        } else {
          numberFormat = NumberFormat.compact(locale: "en_IN");
        }
        var text = numberFormat.format(args.value);
        return ChartAxisLabel(text, args.textStyle);
      }, 
0

By using the numberFormat property, you can achieve the mentioned requirement by passing the respective locale to the compact method in the NumberFormat based on the required region.

  • Thanks, But as I mentioned in the question, Directly passing the number format method to numeric axis would not work, because the india region doesn't use "K" as thousand, instead they are using "T". – Vetrivelu Murugesan Aug 09 '23 at 08:56