使用多个纹理three.js立方体的验证立方体、多个、纹理、three

2023-09-07 22:07:07 作者:记忆断断续续

有人可以请检查下面的$ C $下three.js R53?

它来自这个问题:How在一个Three.js立方体使用多种材料?

我想这code和一些变化,但我不可见的立方体。我的纹理图像命名,因为他们应该的。

  VAR材料= [];

对于(VAR I = 0; I< 6,我++){
  VAR IMG =新的图像();
  img.src = I +'的.png;
  变种特=新THREE.Texture(IMG);
  img.tex = TEX;

  img.onload =功能(){
      this.tex.needsUpdate = TRUE;
  };

  VAR垫=新THREE.MeshBasicMaterial({颜色:0XFFFFFF,地图:特});
  materials.push(垫);
}

变种cubeGeo =新THREE.CubeGeometry(400,400,400,1,1,1,材料);
VAR立方=新THREE.Mesh(cubeGeo,新THREE.MeshFaceMaterial());
 

解决方案

做到这一点,而不是:

  VAR cubeGeo =新THREE.BoxGeometry(400,400,400,1,1,1);
VAR立方=新THREE.Mesh(cubeGeo,新THREE.MeshFaceMaterial(材料));
 

请参阅迁移维基:https://github.com/mrdoob/three.js/wiki/Migration.

编辑: CubeGeometry 已更名为 BoxGeometry

three.js r.67

Three.js杂记 十 贴图

Can someone please verify the following code for three.js r53?

It's taken from this question: How to use multiple materials in a Three.js cube?

I tried this code and a few variations but I don't get visible cubes. My texture images are named as they should be.

var materials = [];

for (var i=0; i<6; i++) {
  var img = new Image();
  img.src = i + '.png';
  var tex = new THREE.Texture(img);
  img.tex = tex;

  img.onload = function() {
      this.tex.needsUpdate = true;
  };

  var mat = new THREE.MeshBasicMaterial({color: 0xffffff, map: tex});
  materials.push(mat);
}

var cubeGeo = new THREE.CubeGeometry(400, 400, 400, 1, 1, 1, materials);
var cube = new THREE.Mesh(cubeGeo, new THREE.MeshFaceMaterial());

解决方案

Do this instead:

var cubeGeo = new THREE.BoxGeometry( 400, 400, 400, 1, 1, 1 );
var cube = new THREE.Mesh( cubeGeo, new THREE.MeshFaceMaterial( materials ) );

See the Migration wiki: https://github.com/mrdoob/three.js/wiki/Migration.

EDIT: CubeGeometry has been renamed to BoxGeometry

three.js r.67