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

3d plot Surface vs scatter3d line

I have a ui problem concerning the 3d surface plots:


In the screen shot you can see that the surface data point and the drawn surface doesn’t match.

Is this intentional? How can I make the surface draw it self to the right point?

Here is the sample page:

y1 = [0,1,2,3,4,5,6,7,8,9,10,11,12,130];

x1 = [
[0,1,2,3,4,5,6],
[0,1,2,3,6,6,6],
[0,1,2,3,4,6,6],
[0,1,6,6,6,6,6],
[6,6,6,6,6,6,6],
[0,1,2,6,6,6,6],
[0,1,6,6,6,6,6],
[0,1,2,3,6,6,6],
[0,1,2,3,4,5,6],
[0,1,2,3,4,5,6],
[0,1,2,3,4,5,6],
[0,1,2,3,4,5,6],
[0,1,2,3,4,5,6],
[0,1,2,3,4,5,6],
[0,1,2,3,4,5,6],
];
z1 = [
[8.83,8.89,8.81,8.87,8.9,8.87],
[8.89,8.94,8.85,8.94,8.96,8.92],
[8.84,8.9,8.82,8.92,8.93,8.91],
[8.79,8.85,8.79,8.9,8.94,8.92],
[8.79,8.88,8.81,8.9,8.95,8.92],
[8.8,8.82,8.78,8.91,8.94,8.92],
[8.75,8.78,8.77,8.91,8.95,8.92],
[8.8,8.8,8.77,8.91,8.95,8.94],
[8.74,8.81,8.76,8.93,8.98,8.99],
[8.89,8.99,8.92,9.1,9.13,9.11],
[8.97,8.97,8.91,9.09,9.11,9.11],
[9.04,9.08,9.05,9.25,9.28,9.27],
[9,9.01,9,9.2,9.23,9.2],
[8.99,8.99,8.98,9.18,9.2,9.19],
[8.93,8.97,8.97,9.18,9.2,9.18]
];

var data_z1 = {x: x1, y: y1, z: z1, type: ‘surface’, showscale: false};
var line1 = {x: x1[0], y: [0,0,0,0,0,0], z: z1[0], type: ‘scatter3d’, mode:‘lines’};
var line14 = {x: x1[13], y: [130,130,130,130,130,130], z: z1[13], type: ‘scatter3d’, mode:‘lines’};

Plotly.newPlot(‘tester’, [data_z1, line1, line14 ]);

At first glance, this looks right to up. What’s the right point in this case?

For me the surface should end at the green line.
Where tool tip ends (the point it should highlight) on the screenshot is in the “air” not on the surface.
If you run the script and move the mouse around that point it will show the same point as green (part of trace 2) and as black (part of trace 0 the surface). However when you look at it there is a gap between the point and the drawn surface.

My problem is the gap between the green line and the surface (at least when its plotted, the tool tips show that the points are on the surface).

Hi Folks, based on the given data structure both the surface and the line should be drawn at y=130. The gap in the visualization is really strange.

Making x 1D (or y 2D`) seems to resolve this issue: https://codepen.io/etpinard/pen/aGNxQQ?editors=0010

But yeah, thanks for bringing this up. Using 1D or 2D x should give the same result. Feel free to open a https://github.com/plotly/plotly.js/issues/new