Published
Edited
May 12, 2022
Exercise 07
THREE = {
const THREE = (window.THREE = await require("three@0.96/build/three.min.js"));
await require("three@0.96/examples/js/controls/OrbitControls.js").catch(
() => {}
);
return THREE;
}
cubea = {
const material = new THREE.MeshBasicMaterial({
color: "green"
});
const geometry = new THREE.BoxGeometry(150,50,50);
return new THREE.Mesh(geometry, material);
}
cubeb = {
const material = new THREE.MeshBasicMaterial({
color: "blue"
});
const geometry = new THREE.BoxGeometry(10,30,10);
return new THREE.Mesh(geometry, material);
}
cubec = {
const material = new THREE.MeshBasicMaterial({
color: "pink"
});
const geometry = new THREE.BoxGeometry(10,31,10);
return new THREE.Mesh(geometry, material);
}
scene = {
const scene = new THREE.Scene();
scene.background = new THREE.Color(0xffffff);
scene.add(cubea);
scene.add(cubeb);
scene.add(cubec);
return scene;
}
height=500
camera = {
const fov = 20;
const aspect = width / height;
const near = 0.5;
const far = 1000;
const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
camera.position.z = 1000;
return camera;
}
This is a model of students queuing up on a school bus
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
