Surface [JavaScript] - No Data / NaN not displayed at the end


I have the following problem. I can’t visualize No Data/ NaN at the end of the chart. When the No Data/ NaN is in the middle, there are no problems and everything works as expected.

Data I use in the examples below.

x: Array with dates as strings in format [‘01/04/2023’, ‘02/04/2023’ …, ‘05/05/2023’]
y: Array with hours as strings in format [‘01:00’, ‘02:00’ …, ‘23:00’]
z: 2D-array with values as numbers in format: [[1000, 2000, NaN, NaN, 0], [1000, 2000, 2500, NaN, 3000]… ]

Example 1: There is No Data / NaN in the middle and everything works as expected. We see blank/ white space. But at the end there is a space with No Data/ NaN that we can’t see.

Example 2: Here we use the same data, but visualize it using a heatmap. As can be seen between 05.02.2023 and 05.04.2023 we have No Data/ NaN. On 05/05/2023 there is data that is equal to zero (0).

I found a solution that suggests using a certain number when we have no Data, but in our particular situation it doesn’t work because we can’t tell the difference between 0 when we have no data and 0 when we really have 0. - Visually marking numpy's NaN as grey - #2 by jmmease

The other thing I tried is to select range on layout.axis, but when I want to visualize dates, again the problem occurs and we don’t get the desired result.

Is there any solution ? Thank you!!

It’s my understanding Plotly will not plot null values, but will plot zero. Are you able to use null where there is no data, and 0 when you really have 0? :thinking: