Hi, I am having problems with lighting my model. When i disable Environment map i see that my model does not receive light properly even tho i use bunch of them. What could be the problem? I see shadows outside of the building when i activate Environment map but I can’t see any shadows inside of the building. I would like to achieve something like this: https://showroom.littleworkshop.fr/ Thanks.
export default function App() {
const texture = useLoader(
RGBELoader,
"https://dl.polyhaven.org/file/ph-assets/HDRIs/hdr/1k/peppermint_powerplant_2_1k.hdr"
);
texture.mapping = THREE.EquirectangularReflectionMapping;
return (
<Canvas shadows>
<color attach="background" args={["#f0f0f0"]} />
{/* <Environment map={texture} /> */}
<group position={[0, -3, 0]}>
<Center top>
<Model scale={1} map={texture} position={[0, 0, 0]} />
</Center>
<AccumulativeShadows
temporal
frames={100}
alphaTest={0.95}
opacity={1}
scale={22}
>
<RandomizedLight
amount={8}
radius={10}
ambient={0.5}
position={[0, 10, -2.5]}
bias={0.001}
size={14}
/>
</AccumulativeShadows>
</group>
<OrbitControls />
<MyLight />
</Canvas>
);
}
const MyLight = () => {
const ref = useRef();
const catchRef = useRef();
useHelper(ref, THREE.PointLightHelper);
return (
<>
<hemisphereLight castShadow position={[0, 0, 0]} />
<pointLight
castShadow
intensity={2}
color="red"
ref={ref}
position={[0, 0, 0]}
/>
<ambientLight
castShadow
color="blue"
position={[0, -7, 0]}
intensity={1.5 * Math.PI}
/>
<pointLight castShadow intensity={200} color="red" position={[0, 4, 0]} />
<ambientLight castShadow intensity={0.5} />
</>
);
};