[英]Texture not getting applied on sides in Three.js
我有一个通过挤压png图像创建的网格。 我已经参考了代码http://wizgrav.github.io/three.js/runner/ 。 我正在对网格物体使用THREE.MeshPhongMaterial。 我正在使用纹理贴图,但是纹理仅应用于网格的正面和背面,而不是侧面。 请参见下面的图片。
侧面占据了纹理的最暗颜色。
我去threejs.org/editor,添加了一个简单的立方体,并应用了具有相同纹理的相同THREE.MeshPhongMaterial材料,并将其应用于立方体的所有侧面。 但是在我的情况下,没有在侧面应用纹理。
码:
var texture = THREE.ImageUtils.loadTexture('/Content/texture-green.jpg');
var bumpTexture = THREE.ImageUtils.loadTexture('/Content/texture-green-bump.jpg');
var specularTexture = THREE.ImageUtils.loadTexture('/Content/texture-green-specular.jpg');
var material = new THREE.MeshPhongMaterial({
map: texture,
bumpMap: bumpTexture,
bumpScale: 0.03,
specularMap: specularTexture
});
var g = new THREE.CanvasGeometry(canvas, { "height": 0.1, "solid": solid, "offset": window.thr, "steps": (steps ? Math.abs(steps) : 5) });
g.center();
mesh = new THREE.Mesh(g, material);
scene.add(mesh);
那么,几何的形成方式是否存在问题( http://wizgrav.github.io/three.js/runner/CanvasGeometry.js )? 还是有另一种方法可以向网格物体的侧面添加纹理?
谢谢。
我点击了此链接,它对我有用。 我必须对纹理进行一些小的改动以使其正确。
texture.wrapS = texture.wrapT = THREE.MirroredRepeatWrapping;
texture.offset.set(0.5, 0.5);
希望这也会对某人有所帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.