Question

我是three.js的新手，需要为学校做一个项目。对于这个项目，我需要在我的立方体上使用纹理。但屏幕保持黑色..并且没有控制台错误！我做了我所能做的一切，所以这是我的最后一次改变哈哈。

我的代码：

<script src="js/three.min.js"></script>
<script>
  var scene = new THREE.Scene();
  var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

  var renderer = new THREE.WebGLRenderer();
  renderer.setSize( window.innerWidth, window.innerHeight );
  document.body.appendChild( renderer.domElement );

  var geometry = new THREE.BoxGeometry( 1, 1, 1 );
  // +
 var material = new THREE.MeshLambertMaterial({
       map: THREE.ImageUtils.loadTexture('images/crate2.jpg')
   })

  // =
  var cube = new THREE.Mesh( geometry, material );
  scene.add( cube );

  camera.position.z = 5;

  var render = function () {
    requestAnimationFrame( render );

    cube.rotation.x += 0.1;
    cube.rotation.y += 0.05;

    renderer.render(scene, camera);
  };

  render();

</script>

Answer 1

你的场景中没有灯光。添加如下所示的工作

// Create ambient light and add to scene.
var light = new THREE.AmbientLight(0xffffff); // white light
scene.add(light);

我会添加一个js小提琴的链接，但似乎它们已经改变了，我无法再找到从哪里获得链接。无论如何，只是广告某种光。

Answer 2

也许添加灯会有帮助吗？那或尝试使用THREE.MeshBasicMaterial

在three.js中的纹理没有控制台错误仍然无法正常工作

2 个答案: