'Flutter FLCharts Grid not rendering correctly

I am showing a chart in my Flutter App using fl_chart library. I am trying to show spots with an y value of either 1, 2, or 3 and I want to draw a horizontal line on the chart on the values 1, 2 and 3.

Here is my code:

class MyChart extends StatelessWidget {
  final List<ScatterSpot> spots;

  const MyChart({
    Key? key,
    required this.spots,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ScatterChart(
      ScatterChartData(
        minX: 1,
        maxX: 5,
        minY: 1,
        maxY: 3,
        scatterSpots: spots,
        gridData: FlGridData(
          show: true,
          drawHorizontalLine: true,
          drawVerticalLine: false,
          getDrawingHorizontalLine: (value) {
            return FlLine(
              color: Colors.grey.shade300,
              strokeWidth: 1,
            );
          },
          horizontalInterval: 1,
        ),
        borderData: FlBorderData(
          show: false,
        ),
        titlesData: FlTitlesData(
          leftTitles: SideTitles(
            showTitles: true,
            getTitles: (value) => value.toString(),
            interval: 1,
          ),
          rightTitles: SideTitles(
            showTitles: false,
          ),
          topTitles: SideTitles(
            showTitles: false,
          ),
          bottomTitles: SideTitles(
            showTitles: false,
          ),
        ),
      ),
    );
  }
}

So, as you can see, I have defined a minY Value of 1 and a maxY Value of 3. I am drawing a horizontal line with an Interval of 1. The Titles on the y-axis are shown correctly for 1, 2 and 3, but the line is only drawn for the value 2, not for the values 1 and 3. How can I fix this?



Solution 1:[1]

Fixed it ^^ I just set borderData with bottom and top BorderSide

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Apri