CODEWITHSUNDEEP
three.jstexturesrenderingmesh
Minichua
Minichua

Reputation: 177

Texture appears black on custom mesh but transparency is right

I created a mesh with vertices and uvs from another geometry like this:

var geom = mesh.geometry;

var projectGeometry = new THREE.Geometry(); 

var faces = [];

for(var i = 0; i < geom.faces.length; i++){

    var verts = [geom.faces[i].a, geom.faces[i].b, geom.faces[i].c];
    var uvs = [geom.faceVertexUvs[0][i][0], geom.faceVertexUvs[0][i][1], geom.faceVertexUvs[0][i][2]];

    var pts = [];
    var uvpts = {};
    var uv = [];

    var vec = geom.vertices[verts[v]].clone();

    for(var n = 0; n < 3; n++){
        uv.push(new THREE.Vector2( (vec[n].x + 1) / 2, (vec[n].y + 1) / 2));
        uvpts = { x: 2*geom.faceVertexUvs[0][i][n].x - 1, y: 2*geom.faceVertexUvs[0][i][n].y - 1, z: 0};
        projectGeometry.vertices.push( uvpts );
    }
    projectGeometry.faceVertexUvs[0].push(uv);

    var newFace = geom.faces[i].clone();

    newFace.a = decalGeometry.vertices.length - 3;
    newFace.b = decalGeometry.vertices.length - 2;
    newFace.c = decalGeometry.vertices.length - 1;

    var newUvFace = new THREE.Face3( newFace.a, newFace.b, newFace.c );

    newUvFace.normal = {x: 0, y: 0, z: 1};        
    newUvFace.color = {r: 1, g: 1, b: 1};         
    newUvFace.vertexNormals.push({x: 0, y: 0, z: 1});         
    newUvFace.vertexNormals.push({x: 0, y: 0, z: 1});         
    newUvFace.vertexNormals.push({x: 0, y: 0, z: 1});         

    projectGeometry.faces.push(newUvFace);
}

The I added the mesh to the scene like this:

    var mesh = new THREE.Mesh(projectGeometry, material.clone());
    scene.add(mesh);

With a material defined like this:

texture = THREE.ImageUtils.loadTexture("tex.png");

material: new THREE.MeshPhongMaterial({
  side: THREE.DoubleSide,
  color: 0xffffff,
  map: texture,
  polygonOffset: true,
  polygonOffsetFactor: -4,
  transparent: true,
  depthWrite: false,
  shininess: 150,
  specular: 0xffffff
});

The texture has some transparency, so I can see that the "shape" of the texture is right but no color is applied. It is all black.

Upvotes: 0

Views: 1387

Answers (1)

Minichua
Minichua

Reputation: 177

It was a light problem. As I have transparency in my texture material, I used the PhongMaterial. I configured a DirectionalLight to illuminate the scene. For some reason the texture colors were rendered black. I changed the light to AmbientLight and everything was rendered fine.

Upvotes: 1

Related Questions