[syncfusion_flutter_charts] [Feature Request] Need the possibility to hide only one edge label

[archie-sh]

In the current implementation it is only possible to hide or keep both edge labels

/// Placement of edge labels in the axis.
enum EdgeLabelPlacement {
  /// - EdgeLabelPlacement.none, places the edge labels in its own position.
  none,

  /// - EdgeLabelPlacement.hides, hide the edge labels.
  hide,

  /// - EdgeLabelPlacement.shift, shift the edge labels inside the plot area bounds.
  shift
}

I need to hide only the left most EdgeLabel, would work the same for the right one e.g.

/// Placement of edge labels in the axis.
enum EdgeLabelPlacement {
  /// - EdgeLabelPlacement.none, places the edge labels in its own position.
  none,

  /// - EdgeLabelPlacement.hides, hide the edge labels.
  hide,
  /// - EdgeLabelPlacement.hides, hide the left-most edge labels.
  hideLeft,
  /// - EdgeLabelPlacement.hides, hide the right-most edge labels.
  hideRight,
  /// - EdgeLabelPlacement.shift, shift the edge labels inside the plot area bounds.
  shift
}

[SriramKiranSenthilkumar]

Hi @archie-sh,

Greetings from Syncfusion. We have analyzed your scenario with the provided information and the requested scenario regarding hiding of only the left most or right most axis label in the chart can also be achieved with the help of the onAxisLabelRender and onActualRangeChanged callback events available in the SfCartesianChart. We have also created a simple sample and attached below in which we have used the above-mentioned events to hide the leftmost or rightmost axis label in the chart. Please refer the code snippet below for further reference.

   // First initialize two string variable to store the visible minimum and maximum axis values
  String axisMinimum;
  String axisMaximum;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text('Syncfusion Flutter chart'),
        ),
        body: SfCartesianChart(
            onActualRangeChanged: (args) {
              if (args.axisName == 'primayXAxis') {
                 // Storing the visible minimum and visible maximum values of the axis to use them for hiding the left and right most axis labels in the onAxisLabelRender event
                axisMinimum = args.visibleMin.toInt().toString();
                axisMaximum = args.visibleMax.toInt().toString();
              }
            },
            onAxisLabelRender: (args) {
              if (args.axisName == 'primayXAxis') {
                // To hide only the left most axis label by checking the axis minimum value and setting the empty string for the label text.
                if (args.text == axisMinimum) {
                  args.text = '';
                }
                // To hide only the right most axis label by checking the axis maximum value and setting the empty string for the label text.
                if (args.text == axisMaximum) {
                  args.text = '';
                }
              }
            },
            primaryXAxis: NumericAxis(
                edgeLabelPlacement: EdgeLabelPlacement.shift,
                name: 'primayXAxis'
            ),
            series: <ChartSeries<_SalesData, num>>[
              LineSeries<_SalesData, num>(
                dataSource: <_SalesData>[
                  _SalesData(2010, 35),
                  _SalesData(2011, 28),
                  _SalesData(2013, 34),
                  _SalesData(2014, 32),
                  _SalesData(2015, 40)
                ],
                xValueMapper: (_SalesData sales, _) => sales.year,
                yValueMapper: (_SalesData sales, _) => sales.sales,
                // your configurations
              )
            ]));
  }

screenshots:

• Hiding the left most axis label in the chart.

• Hiding the right most axis label in the chart

The sample for reference can be found below.
sample.zip

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

Regards,
Sriram Kiran

[archie-sh]

Hi, thank you for taking the time to respond and for providing the sample, thats going above and beyond. I can confirm the solution works. I am closing the ticket.

[walsha2]

@SriramKiranSenthilkumar, I agree with @archie-sh. That was a fantastic response. Thank you for being so thorough. The community really appreciates it!