Vega-Lite中Y轴网格线与柱状图未居中对齐问题求助

问题出在Y轴的nominal类型刻度默认布局上：水平柱状图的柱子是居中分布在分类刻度的区间内，而Y轴网格线默认对齐到分类刻度的位置，导致两者错位。

只需给Y轴的scale配置添加bandPosition: 0.5，让网格线对齐到分类区间的中心，就能和柱子居中对齐。

修改后的encoding配置如下：

encoding: {
      x: {
        field: 'b',
        type: 'quantitative',
        axis: {
          labels: true,
          labelAngle: 0,
          title: null,
          labelFontSize: 10,
          labelColor: '#94A3B8',
          ticks: false,
          domain: false,
          gridColor: "#E2E8F0",
          labelPadding: 10,
          grid: true
        },
        scale: {
          paddingInner: 0.2,
          paddingOuter: 0.1,
        },
        sort: { field: 'c' }
      },
      y: {
        field: 'a',
        type: "nominal",
        axis: {
          title: null,
          labelFontSize: 10,
          labelColor: '#94A3B8',
          ticks: false,
          domain: false,
          gridColor: "#E2E8F0",
          labelPadding: 16,
          labelOffset: 3,
          grid: true
        },
        scale: {
          bandPosition: 0.5 // 添加这一行，让网格线对齐柱子中心
        }
      },
}

bandPosition参数用于设置刻度和网格线在分类区间中的位置，0对应区间起始，1对应区间结束，0.5就是正中心，刚好匹配水平柱状图的柱子位置。

内容的提问来源于stack exchange，提问作者Denys