Flutter图表如何旋转X轴？

Question

示例图像 我如何只旋转柱状图的x轴？ 我使用 Kotlin 语言的 labelRotationAngle 来实现它。Flutter 可以实现吗？感谢您的帮助。

旋转

 charts.BarChart(
   _createDataForChart(key, city_name),
   animate: true,
   behaviors: [new charts.PanAndZoomBehavior()],,
   )
List<charts.Series<priceChart,String>> _createDataForChart(key, city_name){
return [
      new charts.Series<priceChart, String>(
        id: 'Sales',
        colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
        domainFn: (priceChart sales, _) => sales.date,
        measureFn: (priceChart sales, _) => sales.price,
        data: data,
      )
    ]
}

- Muzaffer

---

你已经竖向创建好了吗？还有旋转的部分需要完成吗？ - nimi0112

Answer 1

您可以使用renderSpec和domainAxis来实现这一点。以下是示例代码：

charts.BarChart(
  seriesList,
  animate: animate,
  domainAxis: new charts.OrdinalAxisSpec(
    renderSpec: charts.SmallTickRendererSpec(
      //
      // Rotation Here, 
      labelRotation: 45,
    ),
  ),
)

45度角度是最好的。如果您使用90度会使图表缩小。但是您可以使用 labelAnchor: charts.TickLabelAnchor.before 以及 labelRotation: -90 来实现您想要的效果。示例代码：

charts.BarChart(
  seriesList,
  animate: animate,

  domainAxis: new charts.OrdinalAxisSpec(
    renderSpec: charts.SmallTickRendererSpec(
      // Rotation Here,
      labelRotation: -90,
      labelAnchor: charts.TickLabelAnchor.before,

    ),
  ),

)

- Arash Mohammadi