Computer Graphics & Visualization @ufrj.br
Published
Edited
Jun 4, 2022
1 fork
2 stars
{
const renderer = new THREE.WebGLRenderer({
canvas: htl.html`<canvas width=800 height=600>`,
antialias: true
});
renderer.shadowMap.enabled = true;
const camera = new THREE.PerspectiveCamera(70, 4 / 3, 0.1, 100);
camera.position.set(0, 0, 4);
const controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.screenSpacePanning = true;
invalidation.then(() => (controls.dispose(), renderer.dispose()));
controls.addEventListener("change", () =>
renderer.render(loadedScene, camera)
);
renderer.render(loadedScene, camera);
return renderer.domElement;
}
THREE = {
const THREE = (window.THREE = await require("three@0.141"));
await require("three@0.141/examples/js/controls/OrbitControls.js").catch(
() => {}
);
return THREE;
}
sceneJSON = jsonFile
? jsonFile.json()
: FileAttachment("sierpinski3d.json").json()
loadedScene = {
const loader = new THREE.ObjectLoader();
return loader.parse(sceneJSON);
}
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.
