CODEWITHSUNDEEP
three.jstexturesphong
ali
ali

Reputation: 559

ThreeJS Phong material is coming dark

I am loading a BM3 file which contains definitions of (geometry and) material information as below:

{
  type: "Phong",
  opacity: 1,
  name: "",
  diffuseMap: 0,
  color: [
    0.254902,
    0.2,
    0.129412,
  ],
  transparent: false,
  specularMap: 1,
  specular: [
    0.811765,
    0.811765,
    0.811765,
  ],
  shininessInSpecMap: true,
  shininess: 174,
  refractionRatioMap: 2,
  refractionRatio: 3.35294,
  normalMap: 3,
  LUTPublications: [
    "pot",
  ],
  lightMap: 4,
}

I then am using ThreeJS to create a Mesh object and MeshPhongMaterial. Below are maps in this order: diffuseMap, normalMap, specularMap, refrationRatioMap, lightMap. The MeshPhongMaterial is created using above maps except the lightMap.

diffuseMap normalMap specularMap refrationRatioMap lightMap

If I load this mesh I get below dark image:

image 1 (original settings)

If I change the color property to (1,1,1) instead. I get just a brighter orange color, but the pot is still dark.

enter image description here

However if I load this object in another application it looks like this: The pot looks bright. It looks to me as if the metal/steel side of the material is not handled correctly, as this is the case with any other model I tried which has a part that looks like steel. Any idea why the material is rendered dark (while it should be rendered differently/brighter)?

enter image description here

Upvotes: 0

Views: 670

Answers (1)

Phil N.
Phil N.

Reputation: 700

Your normal map is likely reversed, which is causing light to reflect away from the camera. In the software where you're generating the normal map, look for a setting like Y+, Y-up, bottom-up, or OpenGL.

Upvotes: 0

Related Questions