Black Lives Matter. Please consider donating to Black Girls Code today.

Grid lines placement in heatmap

Hello,

I would like to have a grid which don’t go through the heatmap block but acts a a border around each block. Please check below the codepen for the issue

Thanks,
Suhas

2 Likes

There’s no way to add borders around each brick in a heatmap at the moment.

You can subscribe to https://github.com/plotly/plotly.js/issues/898 for the latest development info.

In the meantime, I’d recommend overlaying layout.shapes or scatter traces http://codepen.io/etpinard/pen/ZBQLGb

2 Likes

Thanks, shapes in overlay worked.

Gird lines can be set with xgap and ygap

Plotly.plot('graph', [{
  type: 'heatmap',
  z: [[1,2], [2,1]],
  xgap :	3,
  ygap :	3
}])

These are gaps and not gridlines! It is so far not possible to color them for example.

For other readers: keep in mind that this will not work inside the “template”-definition.