Three.JS 渲染 .stp 文件

问题描述 投票:0回答:1

我希望基于“.stp”文件创建一个简单的 3D 模型预览。

在搜索时我发现了Three JS libairy。该库允许您渲染 3D 文件,如下例所示:https://thirdjs.org/examples/#webgl_loader_3mf

我很想将其实现到我自己的网站中,除了 .stp 文件(文件:https://www.eleq.com/binaries/downloads/ELEQ%20LS-94%203D%20solid.stp)。

我尝试使用

THREE.ObjectLoader
加载此文件,但没有成功。加载程序需要 JSON 格式。

// Create a scene
var scene = new THREE.Scene(); 
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); 
var renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); 
document.body.appendChild(renderer.domElement);
        
// Load the object
var loader = new THREE.ObjectLoader();
loader.load(
  // resource URL
  'https://www.eleq.com/binaries/downloads/ELEQ%20LS-94%203D%20solid.stp',
  
  // called when resource is loaded
  function ( gltf  ) {
    scene.add( gltf.scene );
  },
  
  // called when loading is in progresses
  function ( xhr ) {
    console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
  },
  
  // called when loading has errors
  function ( error ) {
     console.log( 'An error happened' );
  }
);
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>My first three.js app</title>
</head>

<body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/110/three.min.js"></script>
</body>

</html>

有人对 3D 模型渲染有经验可以帮助我吗?

javascript html three.js 3d
1个回答
0
投票

我相信你必须将文件转换为gltf格式,以便它可以加载和显示

您可以从官方 Three.js 论坛查看此帖子

https://discourse.thirdjs.org/t/is-there-any-way-to-load-step-file-using- Three-js/2842/5

© www.soinside.com 2019 - 2024. All rights reserved.