The same can be said, how to make the sky look clear
// renderer
const renderer = new THREE.WebGLRenderer({ canvas: el, antialias: true });
renderer.shadowMap.enabled = true;
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.outputEncoding = THREE.sRGBEncoding;
renderer.toneMapping = THREE.ACESFilmicToneMapping;
renderer.toneMappingExposure = 0.5;
// sky
const effectController = {
turbidity: 10,
rayleigh: 3,
mieCoefficient: 0.005,
mieDirectionalG: 0.7,
elevation: 70,
azimuth: 180,
exposure: renderer.toneMappingExposure
};
const sky = new Sky();
sky.scale.setScalar(450000);
const sun = new THREE.Vector3();
const uniforms = sky.material.uniforms;
uniforms['turbidity'].value = effectController.turbidity;
uniforms['mieCoefficient'].value = effectController.mieCoefficient;
uniforms['mieDirectionalG'].value = effectController.mieDirectionalG;
const phi = THREE.MathUtils.degToRad(90 - effectController.elevation);
const theta = THREE.MathUtils.degToRad(effectController.azimuth);
sun.setFromSphericalCoords(1, phi, theta);
uniforms['sunPosition'].value.copy(sun);
// AmbientLight
const light = new THREE.AmbientLight(0xffffff);
// scene
const scene = new THREE.Scene();
scene.fog = new THREE.Fog(0xe4e8e9, 0 ,200);
render~
i hope
What am I doing wrong or what should I do?