当我尝试在由对象加载器 THREE.OBJLoader
加载的搅拌器对象中使用的着色器 Material 中使用纹理时,我遇到了问题。
这个简单的代码工作正常,它正在加载纹理并将其应用于加载的对象。
var manager = new THREE.LoadingManager();
var texture = new THREE.Texture();
var imageLoader = new THREE.ImageLoader(manager);
var objLoader = new THREE.OBJLoader(manager);
imageLoader.load("texture.png", function (image) {
texture.image = image;
texture.needsUpdate = true;
});
var material = new THREE.MeshBasicMaterial({ map: texture});
objLoader.load("blenderObject.obj", function (object) {
object.traverse(function (child) {
if (child instanceof THREE.Mesh) {
child.material = material;
}
});
scene.add(object);
但我想使用我的 ShaderMaterial
而不是 MeshBasicMaterial
。该着色器 Material 适用于我在项目中使用的其他对象。这是我的着色器 Material 的初始化:
var uniforms = {
texture: { type: "t", value: THREE.ImageUtils.loadTexture("texture.png") },
}
var shader = THREE.ShaderLib["shader"];
var material = new THREE.ShaderMaterial({
uniforms: uniforms,
vertexShader: shader.vertexShader,
fragmentShader: shader.fragmentShader,
depthTest: true,
});
所以当我使用这种 Material 而不是 MeshBasicMaterial
时,我没有错误,但对象只是全黑。我想知道在着色器 Material 中使用由 THREE.OBJLoader
创建的对象的纹理的正确方法是什么。当我将此着色器应用于其他对象时,它的工作方式与应有的完全一样。提前感谢任何答案。
最佳答案
所有纹理都是平等的。创建对象的方式没有区别。
您的代码存在的问题是,当您分配 uniforms
变量时,您的纹理值将为空,因为 THREE.ImageUtils.loadTexture()
是异步的。使用 THREE.TextureLoader()
的正确方法记录在:http://threejs.org/docs/#Reference/Loaders/TextureLoader
关于javascript - three.js:在添加到对象加载器加载的对象的着色器 Material 中使用纹理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34356071/