Public
Edited
Oct 21, 2023
Cube
Insert cell
Insert cell
{
const scene = new THREE.Scene();
scene.background = new THREE.Color(0xFFCF8B);

const camera = new THREE.PerspectiveCamera( 60, window.innerHeight / window.innerWidth, 1, 1000 );
camera.position.set(2, 2, -2)
camera.lookAt(new THREE.Vector3(0, 0, 0));

const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerHeight / 2, window.innerWidth / 2 );

const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshNormalMaterial();
const cube = new THREE.Mesh( geometry, material );
scene.add( cube );

function animate() {
requestAnimationFrame( animate );
renderer.render( scene, camera );

cube.rotation.z += 0.01;
}
animate();

return renderer.domElement
}
Insert cell
Insert cell
THREE = require("three")
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