How to make the content inside the BarChart horizontally scrollable?

Question

I am using the fl_chart package for plotting a graph in my application and I want only the content inside the BarChart to scroll horizontally, instead of wrapping it in a Container and SingleChildScrollView which scrolls the whole BarChart.

here is the code for the BarChart:

SingleChildScrollView(
                            scrollDirection: Axis.horizontal,
                            controller: barChartScroller,
                            reverse: true,
                            physics: const NeverScrollableScrollPhysics(),
                            child: SizedBox(
                              height: 325,
                              width: MediaQuery.of(context).size.width,
                              child: BarChart(
                                BarChartData(
                                  titlesData: FlTitlesData(
                                    leftTitles: AxisTitles(
                                      axisNameSize: 30,
                                      axisNameWidget: const Text(
                                        "Glasses",
                                        style: TextStyle(color: Colors.teal),
                                      ),
                                      sideTitles: SideTitles(
                                        // showTitles: true,
                                        reservedSize: 40,
                                      ),
                                    ),
                                    topTitles: AxisTitles(),
                                    bottomTitles: AxisTitles(
                                      sideTitles: SideTitles(
                                        getTitlesWidget: getTitles,
                                        reservedSize: 30,
                                        showTitles: true,
                                      ),
                                    ),
                                  ),
                                  gridData: FlGridData(
                                      show: true,
                                      drawVerticalLine: true,
                                      drawHorizontalLine: true,
                                      horizontalInterval: 4),
                                
                                  alignment: BarChartAlignment.center,
                                  maxY: 16,
                                  barTouchData: BarTouchData(enabled: true),
                                  barGroups: data
                                      .map(
                                        (d) => BarChartGroupData(
                                          barsSpace: 20,
                                          x: int.parse(
                                            d.date!,
                                          ),
                                          barRods: [
                                            BarChartRodData(
                                              toY: double.parse(d.waterGlass!),
                                              width: 20.0,
                                              color: orange,
                                              borderRadius:
                                                  const BorderRadius.only(
                                                topLeft: Radius.circular(6),
                                                topRight: Radius.circular(6),
                                              ),
                                            ),
                                          ],
                                        ),
                                      )
                                      .toList(),
                                ),
                                
                              ),
                            ),
                          ),

Any sort of help would be kindly appreciated. Thanks!