昨天我问了这个问题(未捕获的类型错误:THREE.MTLLoader 不是构造函数 2.0 https://stackoverflow.com/questions/47741644/uncaught-typeerror-three-mtlloader-is-not-a-constructor-2-0),我以为我终于开始工作了,但现在却出现了新的问题:
我已经使用 npm 安装了“三 mtl-loader”,但现在看来该对象不可见,尽管我可以console.log
我看到该物体存在的方式。
由于某种原因,它现在抛出以下错误,我想这就是它不可见的原因:
THREE.MeshPhongMaterial: .shading has been removed. Use the boolean .flatShading instead.
get @ three.js:43339
WebGLPrograms.getParameters @ three.js:17838
initMaterial @ three.js:21734
setProgram @ three.js:21929
WebGLRenderer.renderBufferDirect @ three.js:20964
renderObject @ three.js:21722
renderObjects @ three.js:21695
WebGLRenderer.render @ three.js:21463
render @ main.ts:163
requestAnimationFrame (async)
render @ main.ts:162
requestAnimationFrame (async)
render @ main.ts:162
requestAnimationFrame (async)
...
我现在的代码如下所示:
import * as THREE from 'three'
import * as OBJLoader from 'three-obj-loader'
OBJLoader(THREE)
import * as MTLLoader from 'three-mtl-loader'
//create global variables such that we can work with models outside of loader:
var model1, model2;
var mtlLoader = new MTLLoader();
mtlLoader.setPath( 'http://blabla/objects/' );
mtlLoader.load( 'bla.obj.mtl', function(materials){
materials.preload();
var objLoader = new THREE.OBJLoader();
objLoader.setMaterials( materials );
objLoader.setPath( 'http://blabla/objects/' );
objLoader.load( 'bla.obj', function (object){
var object1 = object.clone();
model1 = object; //save in global variables and add those to the scene
model2 = object1;
scene.add(model1);
scene.add(model2)
});
});
我不太确定是否存在与此类似的问题:https://github.com/sohamkamani/ Three-object-loader/issues/9 https://github.com/sohamkamani/three-object-loader/issues/9,因为如果我例如插入:
let child;
for(let i = 0; i < object.children.length; i++) {
child = object.children[i];
scene.add(new THREE.Mesh(child.geometry, new THREE.MeshPhongMaterial({ })));
}
插入了白色网格 - 但我不知道如何将 mtl 文件作为颜色插入,因为在示例中他们使用getHex()
。如果我必须单独为每个网格执行此操作,这似乎也需要很长时间(我正在克隆模型,因为我需要两个)。或者我可以以某种方式使用 object.traverse - 我不想手动更改加载程序。
非常感谢任何帮助:D
EDIT我现在已经尝试了很多不同的方法,但还没有一个有效,所以我将在这里总结一下问题,希望有人能看到哪里出了问题:
-
上面提到的方法,并在评论中解释了为什么它不起作用。我更新到了三个的最新版本,现在我得到了相同的错误,但仅作为警告,并且对象仍然不可见。现在错误似乎来自其他地方。如果我在 OBJloader 中将其更改为平面着色,警告就会消失,但对象仍然不可见 - 而且我真的不想更改文件。
THREE.MeshPhongMaterial: .shading has been removed. Use the boolean .flatShading instead
set @ three.js:43344
parse @ index.js:628
(anonymous) @ index.js:58
(anonymous) @ three.js:30483
XMLHttpRequest.send (async)
load @ three.js:30563
load @ index.js:56
(anonymous) @ main.ts:117
(anonymous) @ index.js:36
(anonymous) @ three.js:30090
XMLHttpRequest.send (async)
load @ three.js:30146
load @ index.js:34
s @ _prelude.js:1
e @ _prelude.js:1
(anonymous) @ _prelude.js:1
仅使用三对象加载器就可以正常工作(如下所述:未捕获的类型错误:THREE.MTLLoader 不是构造函数 https://stackoverflow.com/questions/46989337/uncaught-typeerror-three-mtlloader-is-not-a-constructor)
-
复制 OBJLoader 和 MTLLoader (https://github.com/mrdoob/ Three.js/blob/master/examples/js/loaders/OBJLoader.js https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/OBJLoader.js
and https://github.com/mrdoob/ Three.js/blob/master/examples/js/loaders/MTLLoader.js https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/MTLLoader.js)
并将它们放入文件夹 Three/src/loaders 中,然后在 Three.js 中包含以下内容:
从 './loaders/MTLLoader.js' 导出 { MTLLoader}
从 './loaders/OBJLoader.js' 导出 { OBJoader}
然后尝试像这样加载它们:
import {MTLLoader} from 'three'
import {OBJLoader} from 'three'
并以与上述相同的方式使用它们会产生Uncaught TypeError: THREE.MTLLoader is not a constructor
当试图console.log(MTLLoader)
or console.log(OBJLoader)
它们都是未定义的。所以我不确定它们是否正确加载到框架中,因为我只能找到在html中加载它们的示例(<script src="js/loaders/OBJLoader.js"></script>
)。我对打字稿还很陌生,所以我不确定是否应该创建一个参考路径,或者如何实现这一点。
如果我尝试使用 OBJLoader2,也会出现同样的问题。
- 我尝试做的最后一件事是加载 obj 和 mtl 加载器,它们实际上位于三个示例中,我在 Three.js 文件中引用了它:
export { OBJLoader } from '../examples/js/loaders/OBJLoader.js'
但这给出了相同的“不是构造函数”错误
`