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

# How to draw separate lines in 3D scatter plot

I’d like to draw separate lines in the same plot, but I can’t figure out how to set the x, y and z coordinates?
This would be a solution, but ugly in programming. I also tried to give more variables at once (like: x: x1, x2 or x: [x1, x2]) without success.

var x1 = [0, 5, 5, 0, 0, 0, 5, 5, 0, 0];
var y1 = [0, 0, 5, 5, 0, 0, 0, 5, 5, 0];
var z1 = [0, 0, 0, 0, 0, 5, 5, 5, 5, 5];
var x2 = [5, 5];
var y2 = [0, 0];
var z2 = [0, 5];

``````        Plotly.plot('chart-div', [{
type: 'scatter3d',
mode: 'lines',
x: x1,
y: y1,
z: z1,
opacity: 1.0,
line: {
width: 2,
color: 'blue',
colorscale: 'Viridis'}
}]
);
Plotly.plot('chart-div', [{
type: 'scatter3d',
mode: 'lines',
x: x2,
y: y2,
z: z2,
opacity: 1.0,
line: {
width: 2,
color: 'blue',
colorscale: 'Viridis'}
}]
);
``````

I’d like to avoid code redundancy or wrapping Plotly.plot method in a function.

Thanks for any help in advanced!

Here’s how: http://codepen.io/etpinard/pen/YGbpyy

In plotly.js lingo, that’s plotting mulitple traces.

Thank you very much etienne!