scattergl: categorical data is not drawn while zooming or panning
example: https://codepen.io/Harrison-Gieraltowski/pen/wvNOJMp
When changing to the pan tool and panning, the points disappear until the mouse is released.
This is not the case if the X and Y values are purely numerical. Changing all of the Y values to a simple string does work, however.
scrollZoom doesn't seem to work in codepen so I can't demonstrate it.
I'm seeing the same issue. From what I can tell the bug was introduced in version 2.26.0 (it works fine in the previous version 2.25.2).
I also see the same issue. Numeric data on both axes has no problem, but plotting time on one axis causes the behavior.
In addition to points disappearing on pan, I also see points disappear when using the drag to zoom feature.
I'm using Plotly.js 2.29.0
+1 on this. Having this issue when using time on one axis (2.33.0)
I guess I have to get super familiar with the internals - because it's not clear to me what changed here to break it: https://github.com/plotly/plotly.js/compare/v2.25.2...v2.26.0
Found the root cause - the issue seems to be this commit: https://github.com/plotly/plotly.js/commit/ab9d1cc39c79c47ee3ccfc1e4cc3ce19dc33c713
If you comment out those lines it works as expected. I'm assuming that it does not take into account some edge case related to dates.
To be more exact it's this line: https://github.com/plotly/plotly.js/blob/master/src/plots/cartesian/dragbox.js#L895
Here is the fix:
if (sp._scene) {
var xrng = Lib.simpleMap(xa.range, xa.r2l);
var yrng = Lib.simpleMap(ya.range, ya.r2l);
if (xa.limitRange) xa.limitRange();
if (ya.limitRange) ya.limitRange();
// date strings for the x axis needs to be converted
// into ms, otherwise it corrupts the plot and removes
// any scattergl traces while zooming or panning
if (xa.type === "date") {
xrng = xa.range.map((range) => Lib.dateTime2ms(range, xa.calendar));
} else {
xrng = xa.range;
}
yrng = ya.range;
sp._scene.update({
range: [xrng[0], yrng[0], xrng[1], yrng[1]],
});
}
Or even simpler:
if (xa.limitRange) xa.limitRange();
if (ya.limitRange) ya.limitRange();
var xrng = Lib.simpleMap(xa.range, xa.r2l);
var yrng = Lib.simpleMap(ya.range, ya.r2l);
Thank you @eiriklv !!