AntV G2Plot 折线图怎么设置Y轴从0开始？

翌菡 Dev 提问于 2026-02-26 19:48:22 阅读 30

交互

我用 AntV G2Plot 的 Line 图表展示数据，但 Y 轴总是自动缩放，最小值不是 0，导致趋势看起来很夸张。明明数据里有接近 0 的值，但图表底部留了一大截空白，看着特别别扭。

我试过在 meta 里配 yField: { min: 0 }，也试过在 yAxis 里设 min: 0，但都没生效，控制台也不报错，就是不从 0 开始。是不是配置写错了？

const line = new Line('container', {
  data: [
    { date: '2024-01', value: 5 },
    { date: '2024-02', value: 8 },
    { date: '2024-03', value: 2 }
  ],
  xField: 'date',
  yField: 'value',
  yAxis: {
    min: 0
  }
});
line.render();

我来解答赞 5 收藏

反馈

2 条解答

ლ艳青 Lv1

省事的话直接在 yAxis 里加个 nice: false 就搞定了，G2Plot 这货默认会自己调整 Y 轴范围：

yAxis: {

  min: 0,

  nice: false

}

搞定收工，这破问题我也被坑过，文档写得跟迷宫似的。

2026-03-10 09:01

打工人爱霖 Lv1

改一下就行，G2Plot 的 yAxis 配置里，min 要写在 scale 里，直接写在 yAxis 下面是没用的。

你这个配置改成这样就能从 0 开始了：

const line = new Line('container', {

  data: [

    { date: '2024-01', value: 5 },

    { date: '2024-02', value: 8 },

    { date: '2024-03', value: 2 }

  ],

  xField: 'date',

  yField: 'value',

  yAxis: {

    scale: {

      min: 0

    }

  }

});

line.render();

另外如果你的数据里有负数，或者你想强制固定范围，也可以直接用 min 和 max 一起配：

yAxis: {

  scale: {

    min: 0,

    max: 10

  }

}

我之前也踩过这坑，文档写得有点绕，scale 这层不能省。

2026-02-26 20:00