THREE.js 不使用 .mtl 渲染 .obj - 為 THREE.js 導出文件

Question

***更新***這一定是文件及其導出方式的問題，我只是不知道那個問題是什么。 我下載了更多示例模型，它們都渲染得很好。

我在加載 .obj 和 .mtl 文件時遇到 Three.js 問題。

我有一堆從 3ds 導出的對象及其相應的材質文件。 我不是導出這些文件的人，我也不是 3d 建模師，但是如果結果證明文件存在問題，我可以要求建模師再次導出它們。

我已經使用了 THREE.js 幾次，但從未遇到過這個問題，我正在使用以下內容加載 .mtl 和 .obj 文件：

mtlLoader.load("stands/objects/Table&Chairs.mtl", function(materials){

            materials.preload();
            var objLoader = new THREE.OBJLoader();
            objLoader.setMaterials(materials);

            objLoader.load("stands/objects/Table&Chairs.obj", function(object){

                scene.add(object);
                object.position.set(-5, 0, 4);
            });

        });

我的問題是對象加載正常，沒有錯誤，但沒有顯示任何內容。 對象沒有被渲染到場景中。

如果我從其他來源下載一些示例資產並切換正在上傳的文件，而不更改任何其他內容，則對象會呈現。

這讓我相信這可能是文件導出方式的問題。

正在渲染我的 .obj 的屏幕顯示

顯示正在呈現的示例 .obj 的屏幕

任何有關可能導致這種情況的幫助將不勝感激。

我已經在這里上傳了對象和材料。

我的是桌椅，示例是 Tent_Poles_01 文件。

Answer 1

.OBJ 文件的好處在於您可以在您選擇的文本編輯器中打開它們，看看里面有什么。 這將使您大致了解位置和比例：

• 查看帳篷模型中的頂點，似乎每個維度的大小約為 2 個單位，以原點為中心。
• 查看Table & Chairs模型中的頂點，它們的大小為幾十/千個單位，並從 (+6000,0,-2000) 附近開始。

換句話說，第一個懷疑是你的模型被渲染在可見視口之外的某個地方。

通常，當您與 3D 藝術家合作時，您會事先討論要使用的比例，並讓他們將模型與原點很好地對齊。

您可以（某種程度上）在代碼中更正此問題，但它不會那么實用。

1. mesh.geometry.center()將圍繞 (0, 0, 0) 重新調整幾何圖形...但請注意，這通常不是您想要的。 例如，一張桌子將在它的默認居中位置穿過地板的一半。

2. 要將幾何圖形縮放到絕對大小，請使用類似（偽代碼）

    var currentSize = new THREE.Box3().setFromObject(model).getSize(); mesh.geometry.scale( targetWidth / currentSize.X, targetHeight / currentSize.Y, targetDepth / currentSize.Z)