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

如何设置AgGrid中Sparklines的Y轴最小/最大边界并统一多图表Y轴?

实现AgGrid中Sparklines统一Y轴范围的方案

完全可行,你可以通过配置Sparkline的轴属性来硬编码统一的Y轴最小/最大值,具体操作如下:

  • 在列定义的cellRendererParams.sparklineOptions中,添加axis.yAxis配置项,直接指定min和max数值
  • 所有需要统一Y轴的Sparkline列,设置相同的yAxis.min和yAxis.max值即可

示例代码如下:

const columnDefs = [
  {
    headerName: '月度营收',
    field: 'revenueData',
    cellRenderer: 'agSparklineCellRenderer',
    cellRendererParams: {
      sparklineOptions: {
        type: 'line',
        axis: {
          yAxis: {
            min: 0,
            max: 15000
          }
        }
      }
    }
  },
  {
    headerName: '用户增长',
    field: 'userGrowthData',
    cellRenderer: 'agSparklineCellRenderer',
    cellRendererParams: {
      sparklineOptions: {
        type: 'column',
        axis: {
          yAxis: {
            min: 0,
            max: 15000 // 和上一列保持一致的Y轴范围
          }
        }
      }
    }
  }
];

配置完成后,所有Sparklines会基于你设定的固定Y轴范围渲染,保证数据可视化的一致性。

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.07.17 19:51:59