CARVIEW |
Select Language
HTTP/2 200
accept-ranges: bytes
access-control-allow-origin: *
age: 0
cache-control: max-age=600
content-encoding: gzip
content-type: text/html; charset=utf-8
date: Tue, 14 Oct 2025 18:54:31 GMT
etag: W/"68e952e4-8c09"
expires: Tue, 14 Oct 2025 18:59:56 GMT
last-modified: Fri, 10 Oct 2025 18:39:32 GMT
server: Vercel
strict-transport-security: max-age=63072000
vary: Accept-Encoding
via: 1.1 varnish
x-cache: HIT
x-cache-hits: 0
x-fastly-request-id: 8abb50a8be5be946429a93eeed359e9cee857956
x-github-request-id: 85F0:7DF25:DBF29:102AB2:68EE9B52
x-proxy-cache: MISS
x-robots-tag: index
x-served-by: cache-bom-vanm7210067-BOM
x-timer: S1760468072.667566,VS0,VE288
x-vercel-cache: MISS
x-vercel-id: bom1::zcfzx-1760468071648-8ff309b0c5b9
content-length: 8618
3d subplots in JavaScript
3D Subplots in JavaScript
How to make 3D Subplots in javascript.
Plotly Studio: Transform any dataset into an interactive data application in minutes with AI. Try Plotly Studio now.
function getrandom(num , mul) {
var value = [ ];
for ( i=0; i <= num; i++ ) {
var rand = Math.random() * mul;
value.push(rand);
}
return value;
}
var trace1 = {
opacity: 0.5,
color: 'rgba(255,127,80,0.7)',
type: 'mesh3d',
x: getrandom(50 , -75),
y: getrandom(50 , 75),
z: getrandom(50 , 75),
scene: "scene1"
};
var trace2 = {
opacity: 0.5,
color: 'pink',
type: 'mesh3d',
x: getrandom(50 , -75),
y: getrandom(50 , 75),
z: getrandom(50 , 75),
scene: "scene2"
};
var trace3 = {
opacity:0.4,
color:'rgb(033,255,100)',
type: 'mesh3d',
x: getrandom(50 , -75),
y: getrandom(50 , -75),
z: getrandom(50 , -75),
scene: "scene3",
};
var trace4 = {
opacity: 0.5,
color:'rgb(200,100,200)',
type: 'mesh3d',
x: getrandom(50 , -75),
y: getrandom(50 , 75),
z: getrandom(50 , 75),
scene: "scene4"
};
var trace5 = {
opacity: 0.5,
color:'rgb(00,150,200)',
type: 'mesh3d',
x: getrandom(50 , 100),
y: getrandom(50 , 100),
z: getrandom(50 , 100),
scene: "scene5",
}
var layout = {
scene1: {
domain: {
x: [0.0, 0.5],
y: [0.5, 1.0]
},},
scene2: {
domain: {
x: [0.5, 1],
y: [0.5, 1.0]
}},
scene3: {
domain: {
x: [0.0, 0.33],
y: [0, 0.5]
},},
scene4: {
domain: {
x: [0.33, 0.66],
y: [0, 0.5]
}},
scene5: {
domain: {
x: [0.66, 0.99],
y: [0, 0.5]
},},
height: 600,
margin: {
l: 0,
r: 0,
b: 0,
t: 0,
pad: 0
},
}
Plotly.newPlot('myDiv', [trace1,trace2,trace3,trace4,trace5], layout);
