지구 렌더링을 향상시키기 위해 Three.js에서 대기 산란 효과를 어떻게 만들 수 있나요?

// Vertex shader
varying vec3 vWorldPosition;

void main() {
  vWorldPosition = vec3(modelMatrix * vec4(position, 1.0));
  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
}

// Fragment shader
uniform vec3 sunPosition;
uniform float sunIntensity;
uniform float atmosphereRadius;
uniform float atmosphereDensity;
uniform float wavelength;

varying vec3 vWorldPosition;

void main() {
  // Calculate the distance between the fragment and the sun
  vec3 sunVector = sunPosition - vWorldPosition;
  float sunDistance = length(sunVector);
  
  // Calculate the optical depth of the atmosphere at the fragment
  float opticalDepth = -atmosphereDensity * sunDistance / wavelength;
  
  // Calculate the transmittance of the atmosphere at the fragment
  float transmittance = exp(opticalDepth);
  
  // Calculate the scattering coefficient of the atmosphere at the fragment
  float scatteringCoefficient = atmosphereDensity / (4.0 * M_PI * wavelength);
  
  // Calculate the radiance of the atmosphere at the fragment
  vec3 radiance = scatteringCoefficient * sunIntensity * transmittance * sunDistance / wavelength;
  
  // Set the fragment color to the radiance
  gl_FragColor = vec4(radiance, transmittance);
}

var earthMaterial = new THREE.MeshBasicMaterial({
  map: earthTexture,
  uniforms: {
    sunPosition: { value: sunPosition },
    sunIntensity: { value: sunIntensity },
    atmosphereRadius: { value: atmosphereRadius },
    atmosphereDensity: { value: atmosphereDensity },
    wavelength: { value: wavelength }
  },
  vertexShader: vertexShader,
  fragmentShader: fragmentShader
});

var earth = new THREE.Mesh(earthGeometry, earthMaterial);
scene.add(earth);