Zooming and hover bugs with multiple heatmap series

[Legiew]

Hey,

I have found a few quirks when using multiple heatmap series in a single chart.
I have to use multiple series because we have data which we can not align to be a simple 2d array as used in a normal heatmap. The only way to do this I found until yet is the following. If there is a better way to do this please let me know.

I have made a codepen example: http://codepen.io/Legiew/pen/dMwYWM

The first bug occures when hovering single datapoints. I want to display only the values of the datapoint under the mouse so I set hovermode to closest. It shows me a single hover info but always for the last serie in the chart and not for the serie I hover.

Second bug occurs while zooming. If you try to zoom in the left corner of the chart you will see that the chart zooms pretty well, but still displays a few non zooming parts of the old view before zooming. You can also see this behaviour in the pic below.

All of the bugs occur with latest version and independent of used browser.

[etpinard]

Thanks for the very detailed report.

Not a lot of users have tried plotting multiple heatmaps on the same plot. Thanks for bringing these issues to our attention.

Here's a workaround: http://codepen.io/etpinard/pen/MyZbwp (though, it doesn't exactly replicate your graph as now the heatmap blocks' dimension are computed using the data as a whole).

[etpinard]

@Legiew looks like mulitple heatmap on the same plot used to behave properly back in plotly.js version v1.3.0: http://codepen.io/etpinard/pen/jqXVBy

Some patch that went into 1.4.0 has some unfortunate side-effects: v1.3.0...v1.4.0

[Legiew]

I noticed that this only is true for the hovering annotations bug. The zooming still works until version 1.6. v1.5.0...v1.6.0

Maybe it will be better to create two issues because these seems to be different bugs in different versions? I will try to have a look at the code in the next days.