Vega lite, y-axis columns are not in the middle of the grid

Question

I added grid for both, x and y axis. For 'x' it works well, but with 'y' something strange, columns are not in the middle of the lines.

My encoding object:

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
        }
      },

In https://vega.github.io/vega-lite/examples/ there is no example with horizontal bar chart with 'x' and 'y' lines. Maybe this is a typical behavior

Thank you in advance!

Answer 1

You can control the position using bandPosition.

https://vega.github.io/vega-lite/docs/band.html