threepipe
Version:
A 3D viewer framework built on top of three.js in TypeScript with a focus on quality rendering, modularity and extensibility.
27 lines (26 loc) • 1.12 kB
JavaScript
import { _testFinish, GLTFAnimationPlugin, LoadingScreenPlugin, ThreeViewer } from 'threepipe';
async function init() {
const viewer = new ThreeViewer({
canvas: document.getElementById('mcanvas'),
msaa: true,
plugins: [LoadingScreenPlugin],
});
const gltfAnimation = viewer.addPluginSync(GLTFAnimationPlugin);
gltfAnimation.autoplayOnLoad = false;
await viewer.setEnvironmentMap('https://threejs.org/examples/textures/equirectangular/venice_sunset_1k.hdr');
await viewer.load('https://cdn.jsdelivr.net/gh/KhronosGroup/glTF-Blender-Exporter@master/polly/project_polly.gltf', {
autoCenter: true,
autoScale: true,
});
const fileCamera = viewer.scene.getObjectByName('Correction__MovingCamera');
if (!fileCamera)
return;
fileCamera.autoAspect = true;
fileCamera.userData.autoLookAtTarget = false;
fileCamera.activateMain();
gltfAnimation.loopAnimations = false;
gltfAnimation.animateOnPageScroll = true;
gltfAnimation.pageScrollAnimationDamping = 0.1;
gltfAnimation.playAnimation();
}
init().finally(_testFinish);