Flutter fl_chart底部标题被切割并且显示不正确。

huangapple go评论51阅读模式
英文:

Flutter fl_chart bottomTitles are cutted out and not displayed correctly

问题

以下是您提供的代码的翻译部分:

我正在从本地的 Json 文件中读取一些值,以便使用 fl_chart 包在图表上显示这些值。

我遇到的问题是屏幕上的 bottonTitle 数据有点被截断了。
我找不出这是为什么发生的原因!

查看照片:[![点击查看图片描述][1]][1]

要在图表上显示这些值,我使用以下代码:

请注意,代码部分未进行翻译,如您所要求。如果您需要更多帮助,请随时提出。

英文:

I am reading from a local Json file some values to be displayed on a chart using fl_chart package.

The problem that i have is that on the screen the bottonTitle data are a little cutted out.
I cannot find out why this is happen!

See Photo: Flutter fl_chart底部标题被切割并且显示不正确。

To display the values on the chart i use the following code:

                                                Column(
                                                  children: [
                                                    const Text(
                                                      'Open Force',
                                                      style: TextStyle(
                                                        color: AppColors.textColor1,
                                                        fontSize: 20.0,
                                                        letterSpacing: 2.0,
                                                      ),
                                                    ),
                                                    const SizedBox(
                                                      height: 10,
                                                    ),
                                                    SizedBox(
                                                      width: 580,
                                                      height: 270,
                                                      child: LineChart(
                                                        LineChartData(
                                                          lineTouchData: LineTouchData(enabled: true),
                                                          lineBarsData: [
                                                            LineChartBarData(
                                                              isStrokeCapRound: false,
                                                              spots: gtxs1.flSpots3,
                                                              isCurved: true,
                                                              barWidth: 3,
                                                              color: const Color.fromARGB(255, 99, 175, 28),
                                                              dotData: FlDotData(
                                                                show: true,
                                                                getDotPainter: (spot, percent, barData, index) {
                                                                  return FlDotCirclePainter(
                                                                    radius: 4,
                                                                    color: const Color.fromARGB(255, 151, 124, 124),
                                                                    strokeColor: AppColors.chartColor1,
                                                                  );
                                                                },
                                                              ),
                                                            ),
                                                          ],
                                                          minY: 0,
                                                          titlesData: FlTitlesData(
                                                            bottomTitles: AxisTitles(
                                                              sideTitles: SideTitles(
                                                                showTitles: true,
                                                                interval: 1,
                                                              ),
                                                            ),
                                                            rightTitles: AxisTitles(
                                                              sideTitles: SideTitles(showTitles: false),
                                                            ),
                                                            topTitles: AxisTitles(
                                                              axisNameWidget: const Text(
                                                                'Max',
                                                                textAlign: TextAlign.start,
                                                                style: TextStyle(
                                                                  color: AppColors.textColor2,
                                                                  fontSize: 16.0,
                                                                ),
                                                              ),
                                                              axisNameSize: 34,
                                                              sideTitles: SideTitles(
                                                                showTitles: true,
                                                                reservedSize: 0,
                                                              ),
                                                            ),
                                                          ),
                                                        ),
                                                        swapAnimationDuration: const Duration(milliseconds: 500),
                                                        //swapAnimationCurve: Curves.easeInOut,
                                                        swapAnimationCurve: Curves.linear,
                                                      ),
                                                    ),
                                                  ],
                                                ),

答案1

得分: 1

你可以尝试调整SideTitles中的reservedSize参数。

SideTitles(
    showTitles: true,
    reservedSize: 30,
)

这是我解决的方法。

英文:

You can try adjusting the reservedSize parameter in SideTitles.

SideTitles(
    showTitles: true,
    reservedSize: 30, 
)

This is how I solved it.

huangapple
  • 本文由 发表于 2023年7月18日 14:14:29
  • 转载请务必保留本文链接:https://go.coder-hub.com/76709958.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定