You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何将SfCartesianChart的底部轴线设置为虚线?

实现SfCartesianChart底部轴线(X轴)为虚线的方法

要将图表底部的X轴设置为虚线,需要在primaryXAxis的axisLine属性中配置dashArray参数,而非仅修改网格线。你的现有代码仅配置了Y轴网格线为虚线,X轴轴线需要单独设置。

修改后的完整代码如下:

SfCartesianChart(
  plotAreaBorderWidth: 0,
  plotAreaBorderColor: Colors.white24,
  primaryXAxis: DateTimeAxis(
    majorGridLines: const MajorGridLines(
      width: 0.5,
      color: Colors.transparent,
    ),
    // 配置X轴轴线为虚线
    axisLine: const AxisLine(
      width: 1,
      color: Colors.white24, // 可根据需求调整颜色
      dashArray: <double>[5, 5], // 第一个值是线段长度,第二个是间隔长度
    ),
  ),
  primaryYAxis: NumericAxis(
    majorGridLines: const MajorGridLines(width: 1, color: Colors.white24, dashArray: <double>[5, 5]),
    minimum: 0,
    maximum: 100
  ),
)

你可以调整dashArray中的两个数值,来改变虚线的线段长度和间隔距离,适配不同的视觉需求。

内容的提问来源于stack exchange,提问作者newbie2210

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.10 05:55:34