Heatmap "streching" of data points

I have a question about Heatmaps in Plotly: Why are some fields in heatmaps larger than others? For example here: https://plot.ly/~jonasber/1/ , all squares have different dimensions. What do I have to change in the settings so that each datapoint gets an equally sized square on the heatmap?

Also, in the example the last data point (2, 10, 3) gets displayed as (3.75, 10, 3) when you hover over the square. I experience the same in plotly.js but is there a way to display the real data on hover?

Hmm. That might be a bug.

In the meantime, I’d recommend setting your heatmap trace using a 2d z array. In the case, the x and y data array correspond to the bricks’ bounds: https://codepen.io/etpinard/pen/GvYYgR

Thank you very much, this helped me!