Software engineer at Hugging Face. Prototyping here with JS, d3, three.js.
Three.js fundamentalsTexture projectionCalibrate a Three.js camera using fSpyVoronoi ClothGeographic map texture in Three.jsTextured lighting in Three.jswebgl / lights / textured spotlightExpresando magnitudes 3D sobre mapas con ThreeJSTransition between Three.js cameras3D base mapSVG icons in three.jsRoads network in three.jsHow to import three.jsSwimming pool 3D modelThree.js camera orientationThree.js Perspective Camera UtilsCameras covered areaHow many cameras see the mouse?Design a springThree.js utilsFind the contour of a camera visible areathreejs Plane.constant is reversed!Import three.js
Export and Load glTF
render(scene, camera)
gltfExport = {
const exporter = new THREE.GLTFExporter();
const gltf = await new Promise(resolve =>
exporter.parse(scene, resolve, {
binary: false,
truncateDrawRange: false
})
);
const blob = new Blob([JSON.stringify(gltf)], { type: 'model/gltf+json' });
return DOM.download(blob, 'south-sudan-roads.gltf', 'Save GLTF');
}
glbExport = {
const exporter = new THREE.GLTFExporter();
const glb = await new Promise(resolve =>
exporter.parse([scene, camera], resolve, {
binary: true,
truncateDrawRange: false
})
);
const blob = new Blob([glb], { type: 'model/gltf-binary' });
return DOM.download(blob, 'south-sudan-roads.glb', 'Save GLB');
}
importedGltf = {
const loader = new THREE.GLTFLoader();
const url = await FileAttachment("south-sudan-roads.gltf").url();
return await new Promise(resolve =>
loader.load(url, function(gltf) {
resolve(gltf);
})
);
}
render(importedGltf.scene, importedGltf.cameras[0])
importedGlb = {
const loader = new THREE.GLTFLoader();
const url = await FileAttachment("south-sudan-roads.glb").url();
return await new Promise(resolve =>
loader.load(url, function(glb) {
resolve(glb);
})
);
}
render(importedGlb.scene, importedGlb.cameras[0])
One platform to build and deploy the best data apps
Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.