Surface graph has issue with small time ranges

[ShaneHudson]

Hello,

I've had an issue for quite a while and thought it would be good to raise here. It's an issue with graphs that are over a small amount of time. I've attempted to make a demonstration but the screenshot below will show my issue more clearly.

Take a look at the following:
A) https://jsfiddle.net/Lv4qpoyu/3/
B) https://jsfiddle.net/5au0xepd/1/

In A) you can see some random data over 50 minutes. In B) you can see random data over 50 seconds. A) works perfectly well, nice little graph. B) looks like an utter mess and is near impossible to use.

So that brings us to C), the screenshots (the first taken a few months ago, the second today) below that shows my real dataset. In a 2D heatmap it works fine but in a 3D surface graph it shows the data correctly but with the axis completely messed up. Sometimes it looks worse than others, but all the time there is a continuation of the date (y) axis. Sometimes it requires you to zoom out to see, but it is always there in the distance. This makes it unusable to me if I want to put it in front of users.

When I've looked online for help I found someone else having the exact same issue but they were using the python version of the library with a scatter3d.

This seems to be a bug opposed to an issue in my code. I have autorange set to false, the range of data is correct (["2018-09-06 20:48:32", "2018-09-06 20:55:57"] for second screenshot) and is using moment dates. I have double checked it on the latest version too and no change. Does anyone have any idea what is causing this issue?

Cheers
Shane

[ShaneHudson]

It looks like this may be related to #3155 but would appreciate any help on the matter.

[archmoj]

@ShaneHudson Thank you very much for reporting this issue.

[ShaneHudson]

Also another thing I've noticed, potentially related to this, is if there is no data on the graph but ranges are set on the axis then for the heatmap it shows correct ranges but the surface plot shows from 2000 to 2001.

[archmoj]

@ShaneHudson Could you please create a demo related to the second issue?

[ShaneHudson]

Thanks for doing that bug fix @archmoj. Do you have any idea when the next version will be published on npm please?

[archmoj]

My pleasure @ShaneHudson.
And thank you for using Plotly at first place!
Version 1.43.0 is setup and it would possibly be released tomorrow.
There are other bug fixes and improvements related to axis ticks & surface traces. In particular this PR should help improve the accuracy of data points on the surface. Although concerning small time-steps we are still working on the dataScale issue as well as local time offsets on 3D axes and webGL.
Therefore this issue is still open.
But until it fixed, one practical solution may be to use minutes instead of the whole date in the axis ticks and then add the date info into the axis label using a break line.
Now with this PR being merged, your graph could look like this demo.

[archmoj]

@ShaneHudson Also here is an alternative demo using superscripts & break-lines. Hope it may help.

[archmoj]

@ShaneHudson FYI - here is the new release v.1.43.0.

[etpinard]

@archmoj can we close this issue?

[archmoj]

@etpinard No. It is not fixed yet.

[ShaneHudson]

I've upgraded to the latest version of Plotly, so here's an updated graph. Looking across a minute.