Public
Edited
Jan 7
Paused
1 fork
Insert cell
Insert cell
Insert cell
THREE = (window.THREE = await require("three@0.160/build/three.min.js"))
Insert cell
Insert cell
Insert cell
size = ({ w: 400, h: 300 })
Insert cell
Insert cell
renderer = {
const r = new THREE.WebGLRenderer({ antialias: true });
r.setSize(size.w, size.h);
r.setPixelRatio(devicePixelRatio);
return r;
}
Insert cell
Insert cell
Insert cell
Insert cell
scene = {
const scene = new THREE.Scene();
const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshNormalMaterial();
const cube = new THREE.Mesh(geometry, material);
scene.add(cube);
return scene;
}
Insert cell
Insert cell
camera = {
const fov = 60;
const aspect = size.w / size.h;
const near = 0.1;
const far = 5;
const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
camera.position.set(1, 0.7, 3);
return camera;
}
Insert cell
Insert cell
Insert cell
{
renderer.render(scene, camera);
return renderer.domElement;
}
Insert cell

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.
Learn more