How to add padding to x and y axis?

Question

I a trying to add padding to my y-axis so that the label have some space on it's left. I am using Charts_flutter dependency for my graph.

Here is the photo:

As you can see, the label on y-axis have no space to it's left.

Here is the code for my graph:

 return Container(
              height: 250,
              child: Card(
                child: Column(
                  children: [
                    Expanded(
                      child: charts.TimeSeriesChart(
                        series,
                        animate: false,
                        defaultRenderer: charts.LineRendererConfig(
                          includeArea: true,
                          includeLine: true,
                          includePoints: true,
                          strokeWidthPx: 0.5,
                          radiusPx: 1.5
                        ),
                        dateTimeFactory: const charts.LocalDateTimeFactory(),
                        behaviors: [
                          charts.SlidingViewport(),
                          charts.PanAndZoomBehavior(),
                          charts.SeriesLegend(
                            position: charts.BehaviorPosition.top,
                            horizontalFirst: false,
                            cellPadding: EdgeInsets.only(
                              left: MediaQuery.of(context).size.width * 0.20, 
                              top: 10
                            ),
                          ),
                          charts.SelectNearest(
                            eventTrigger: charts.SelectionTrigger.tap
                          ),
                          charts.LinePointHighlighter(
                            symbolRenderer: CustomCircleSymbolRenderer(size: size),
                          ),
                        ],
                        selectionModels: [
                          charts.SelectionModelConfig(
                          type: charts.SelectionModelType.info,
                          changedListener: (charts.SelectionModel model) {
                            if(model.hasDatumSelection) {
                              final tankVolumeValue = model.selectedSeries[0].measureFn(model.selectedDatum[0].index).round();
                              final dateValue = model.selectedSeries[0].domainFn(model.selectedDatum[0].index);
                              CustomCircleSymbolRenderer.value = '$dateValue \n $tankVolumeValue L';
                            }
                          })
                        ]),
                      ),
                    ],
                  ),
              ),
            );

Any help would be appreciate.

Answer 1

Add some left Padding to your charts.TimeSeriesChart.

Container(
  height: 250,
  child: Card(
    child: Column(
      children: [
        Expanded(
          child: Padding(
            padding: const EdgeInsets.only(left: 16.0),
            child: charts.TimeSeriesChart([...]),
          ),
        ),
      ],
    ),
  ),
);