Three.js STL文件加载器实例

STL是3D建模和打印的数据标准。本例演示如何使用STLLoader扩展来加载二进制和文本格式的外部STL文件。带光照和阴影效果。 Note: upgraded from r69 to r78.

three, stl, loader

《aframe.js 3d拼图代码详解》作品已被踏得网收录！

第三方库
作品简介 29527
作品推荐
使用帮助
常用链接

HTML
CSS
JavaScript
Result

编译

JavaScript

if (!Detector.webgl) Detector.addGetWebGLMessage();
var container, stats;
var camera, cameraTarget, scene, renderer;
init();
animate();

function addShadowedLight(x, y, z, color, intensity) {
    var directionalLight = new THREE.DirectionalLight(color, intensity);
    directionalLight.position.set(x, y, z);
    scene.add(directionalLight);
    directionalLight.castShadow = true;
    var d = 1;
    directionalLight.shadow.camera.left = -d;
    directionalLight.shadow.camera.right = d;
    directionalLight.shadow.camera.top = d;
    directionalLight.shadow.camera.bottom = -d;
    directionalLight.shadow.camera.near = 1;
    directionalLight.shadow.camera.far = 4;
    directionalLight.shadow.mapSize.width = 1024;
    directionalLight.shadow.mapSize.height = 1024;
    directionalLight.shadow.bias = -0.005;
}

function onWindowResize() {
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    renderer.setSize(window.innerWidth, window.innerHeight);
}

function animate() {
    requestAnimationFrame(animate);
    render();
    stats.update();
}

function render() {
    var timer = Date.now() * 0.0005;
    camera.position.x = Math.cos(timer) * 3;
    camera.position.z = Math.sin(timer) * 3;
    camera.lookAt(cameraTarget);
    renderer.render(scene, camera);
}

编译

CSS

HTML

STL是3D建模和打印的数据标准。本例演示如何使用STLLoader扩展来加载二进制和文本格式的外部STL文件。带光照和阴影效果。 Note: upgraded from r69 to r78.

three, stl, loader

编辑器支持Emmet

快捷键

STL是3D建模和打印的数据标准。本例演示如何使用STLLoader扩展来加载二进制和文本格式的外部STL文件。 带光照和阴影效果。 Note: upgraded from r69 to r78.

three, stl, loader

WebGL Three.js - glTF模型加载器在线示例：钢铁头盔

three.js Draco模型压缩文件加载代码示例

编辑器支持Emmet

快捷键

语言：

语言：

导入代码模板：

STL是3D建模和打印的数据标准。本例演示如何使用STLLoader扩展来加载二进制和文本格式的外部STL文件。带光照和阴影效果。 Note: upgraded from r69 to r78.