飞机总是黑的 [英] Plane always black

问题描述

我想在我的飞机上添加一个重复水平和垂直的纹理。问题是，当我尝试应用纹理时，它总是黑色的。我没有得到任何错误，我已经尝试添加一些灯，但问题仍然存在;我不知道如何解决它...这就是我所做的：

I want to add a texture to my plane that repeats horizontal and vertical. The thing is, when I try to apply the texture, it is always black. I don't get any errors, and i already tried to add some lights, but the problem is still there; I don't know how to solve it... Here is what I did:

window.onload = function init()
{
  scene = new THREE.Scene();

  var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
  camera.position.x = -30;
  camera.position.y = 40;
  camera.position.z = 30;
  camera.lookAt(scene.position);

  var light = new THREE.AmbientLight( 0x404040 ); // soft white light
  scene.add( light );

  var spotlight = new THREE.SpotLight( 0xffffff);
  spotlight.position.set( -50, 40, 0 );
  scene.add( spotlight );


var axes = new THREE.AxisHelper( 20 ); scene.add(axes);

  var renderer = new THREE.WebGLRenderer();
  renderer.setClearColor(0xEEEEEE);
  renderer.setSize(window.innerWidth, window.innerHeight);

  desenhaMapa();

  document.body.appendChild( renderer.domElement );
  renderer.render(scene, camera);

}

    function desenhaMapa()
{
  labirinto = new THREE.Object3D();

  var texturaPlano = new THREE.TextureLoader().load("texturaPac.jpg");

  geometryPlano = new THREE.PlaneGeometry(50,50);
  materialPlano = new THREE.MeshPhongMaterial( {map: texturaPlano} );
  var planoPacMan = new THREE.Mesh(geometryPlano,materialPlano);
  planoPacMan.rotation.x = -0.5 * Math.PI;
  scene.add(planoPacMan);
}

有任何建议吗？

推荐答案

TextureLoader.load（）是一种异步方法。这就是为什么它有一个 onload 参数。

TextureLoader.load() is an asynchronous method. That is why it has an onload argument.

你正在调用 render（）在纹理加载之前。一种解决方案是在加载器回调中调用 render（）。

You are calling render() before the texture loads. One solution is to call render() in the loader callback.

var loader = new THREE.TextureLoader();

var texture = loader.load( 'myTexture.jpg', function ( texture ) {

    renderer.render( scene, camera );

} );

另一个解决方案是动画循环。但静态场景不需要这样做。

Another solution is to have an animation loop. But that is not required for static scenes.

three.js r.78

three.js r.78

这篇关于飞机总是黑的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！