THREE.MeshStandardMaterialのmetalnessを1にすると環境光源（THREE.AmbientLight）が当たってないように見える 👀

Three.jsに3Dモデルを読み込んだとき、時々、環境光源（AmbientLight）が当たらないモデル（平行光源・DirectionalLightや点光源・PointLightなど他のライトは当たる）がありまして、しょうがないので他のライトで照らしていたのですが、やっぱり気になるので調べてみたところ、THREE.MeshStandardMaterialのmetalnessを1にすると環境光源が当たらなくなる、正確にいうと環境光源が鏡面反射してしまうため見えなくなってしまうということがわかりました。

簡単な対策としては、metalnessを1以外の値にすればOKです。

DEMO

develop.kimizuka.org

右上のスライダーでmetalnessの値を調整できます。
metalnessを1にすると環境光源が当たらなくなることを確認できます。

JavaScript（抜粋）

model.traverse((object) => {
  if (object.isMesh) {
    object.material.metalness = metalness; // ここで1以外の値を代入すれば環境光源が当たるようになる
  }
});