无法将多个纹理应用于简单的多维数据集

时间:2013-11-07 02:45:00

标签: three.js

使用three.js r62

grass_side = new THREE.MeshLambertMaterial({
    map: THREE.ImageUtils.loadTexture('assets/blocks/grass_side.png')
});

grass_top = new THREE.MeshLambertMaterial({
    map: THREE.ImageUtils.loadTexture('assets/blocks/grass_top.png')
});

materials = new THREE.MeshFaceMaterial([
    grass_side,
    grass_top
]);

cube = new THREE.CubeGeometry(30, 30, 30);
cube.faces[0].materialIndex = 0;
cube.faces[1].materialIndex = 0; 
cube.faces[2].materialIndex = 0; 
cube.faces[3].materialIndex = 0;
cube.faces[4].materialIndex = 1; 
cube.faces[5].materialIndex = 1;

box = new THREE.Mesh(cube, materials);
scene.add(box);

我在stackoverflow上的某个地方找到了这个代码,但它无法正常工作。我一直收到这些错误:

Uncaught TypeError: Cannot read property 'map' of undefined three.js:376
Uncaught TypeError: Cannot read property 'attributes' of undefined three.js:458

1 个答案:

答案 0 :(得分:0)

你的问题在哪里? 如果您需要多纹理多维数据集的工作示例,可以查看:http://stemkoski.github.io/Three.js/Mesh-Movement.html

使用的代码如下:

// create an array with six textures for a cool cube
var materialArray = [];
materialArray.push(new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'images/xpos.png' ) }));
materialArray.push(new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'images/xneg.png' ) }));
materialArray.push(new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'images/ypos.png' ) }));
materialArray.push(new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'images/yneg.png' ) }));
materialArray.push(new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'images/zpos.png' ) }));
materialArray.push(new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'images/zneg.png' ) }));
var MovingCubeMat = new THREE.MeshFaceMaterial(materialArray);
var MovingCubeGeom = new THREE.CubeGeometry( 50, 50, 50, 1, 1, 1, materialArray );
MovingCube = new THREE.Mesh( MovingCubeGeom, MovingCubeMat );
MovingCube.position.set(0, 25.1, 0);
scene.add( MovingCube );