0

我正在使用 fl_chart 在 Flutter 应用程序中绘制条形图。我对 x 轴单位有很长的标题,我看到的问题是,标题的长度越长,对齐就越容易折腾。

在下图中,长度较短的 x 轴标题与条正确对齐,而文本较长的标题似乎远离图表。

在此处输入图像描述

标题数据:

FlTitlesData get titlesData => FlTitlesData(
      show: true,
      bottomTitles: SideTitles(
        showTitles: true,
        getTextStyles: (context, value) => const TextStyle(
          color: Color(0xff7589a2),
          fontWeight: FontWeight.bold,
          fontSize: 14,
        ),
        rotateAngle: 300,
        getTitles: (double value) {
          switch (value.toInt()) {
            case 0:
              return 'Test';
            case 1:
              return 'Unassigned 123434';
            case 2:
              return 'Alert Saftey 123243';
            case 3:
              return 'Belfast 12324';
            case 4:
              return 'Cardiff 243423';
            case 5:
              return "Domino's Pizza 123234";
            case 6:
              return 'Glasgow 1232';
            case 7:
              return 'James Newma 13434';
            case 8:
              return 'LCC';
            case 9:
              return 'Liverpool';
            case 10:
              return 'Testing 123455 454545';
            case 11:
              return 'Testing 456';
            case 12:
              return 'Testing 789';
            case 13:
              return 'Testing 321';
            case 14:
              return 'Testing 890';
            default:
              return '';
          }
        },
      ),
      leftTitles: SideTitles(
        showTitles: true,
        getTextStyles: (context, value) => const TextStyle(
            color: Color(0xff7589a2),
            fontWeight: FontWeight.bold,
            fontSize: 14),
        getTitles: (value) {
          if (value == 25) {
            return '25';
          } else if (value == 50) {
            return '50';
          } else if (value == 75) {
            return '75';
          } else {
            return '';
          }
        },
      ),
      topTitles: SideTitles(showTitles: false),
      rightTitles: SideTitles(showTitles: false),
    );

条形图数据:

BarChart(
          BarChartData(
            titlesData: titlesData,
            gridData:
                FlGridData(drawHorizontalLine: true, drawVerticalLine: false),
            axisTitleData: axisTitleData(context),
            borderData: borderData,
            barGroups: barGroups,
            maxY: 75,// Dynamic
          ),
        ),
4

0 回答 0