Set relative height/width in heatmap

[hcraT]

Hi,
I would like to be able to set the width of the rect marks of an heatmap in a way that is independent from the chart size.

From the documentation I figured out how to set the absolute size:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {"url": "data/cars.json"},
  "mark": {
    "type": "rect",
    "width": 10
  },
  "encoding": {
    "y": {"field": "Origin", "type": "nominal"},
    "x": {"field": "Cylinders", "type": "ordinal"},
    "color": {"aggregate": "mean", "field": "Horsepower"}
  },
  "config": {
    "axis": {"grid": true, "tickBand": "extent"}
  }
}

It is not possible, however, to specify a value like "50%" for the width field. With 50% I mean that each cell of the heatmap is centered in the x coordinate and fills the 50% of the available width (instead of the default 100%).

I know that one could set both the x and x2 fields and I'm using this approach. So I compute the coordinates of the rects manually but this means that I need to override the axes as well to properly label my heatmap. From the documentation I wasn't able to figure out if there are options to obtain what I need.

Do you have suggestions?

Thank you very much.

Best!

[domoritz]

I think you can achieve this with the Band scale properties. Something like this

...
"scale": {"padding": 0.5, "align": 1}
...

[hcraT]

Hi,
thanks for your reply.
This indeed works.

When I try to apply this to my use case I get a visualization issue (the x axis moves to the top of the plot). See here for the example (the plot is nonsensical just to showcase my need).

Is this a bug? Should I open an issue?

I played around a little bit and I think that the problem is due to the resolve config because it happens even if I don't specify any scale. Just setting either resolve.scale.x = "independent" or resolve.scale.y = "independent" messes things up. However if I set any height for the plot when set the y scale to independent or any width when instead acting on the x scale the problem goes away (see here).

Thanks!
Best