THREE.Material: ‘map’ parameter is undefined.
var materials=[]
for (let i = 0; i < 18; i++) {
materials[i] = new THREE.MeshBasicMaterial({
map: textures[i],
side: THREE.DoubleSide
});
}
// var material = new THREE.MeshBasicMaterial({
// map: textures[1],
// side: THREE.DoubleSide
// });
// var material = new THREE.MeshFaceMaterial(materials);
var mesh = new THREE.Mesh(geometry, materials)
mesh.position.z = 200
this.RTScene.add(mesh);
MeshFaceMaterial was kinda just a wrapper around an array of materials (see here).
You can just use [] as an equivalent.
@mjurczyk I’m sorry, I didn’t quite understand what you said, and IN the link you gave me,
But I’m not sure how I should deal with it
Check your array “textures” in console. Maybe they are undefined.
For 18 faces you need manualy change values in geometry.groups
Manual groups like this. Box is 48 triangles. Textured 36 faces.
var textures=[];
var textureLoader=new THREE.TextureLoader();
for(var n=0;n<18;n++){
textures["num_"+n]=textureLoader.load('images/grass.jpg');
}
var materials=[];
for(var n=0;n<18;n++){
materials[n]=new THREE.MeshBasicMaterial({
map:textures["num_"+n],
side:THREE.DoubleSide
});
}
var geometry=new THREE.BoxBufferGeometry(5,5,5,2,2,2);
geometry.groups=[];
var triangles=2;
var vertices=triangles*3;
for(var n=0;n<18;n++){
geometry.groups.push({start:n*vertices,count:vertices,materialIndex:n});
}
var mesh=new THREE.Mesh(geometry,materials);
mesh.position.z=200;
scene.add(mesh);
