Earth Atmosphere Scattering Threejs r105

by tfoller

CSS

body{ margin: 0; background: #000000;}

JavaScript

import * as THREE from 'https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.js'

const renderer = new THREE.WebGLRenderer({
    antialias: true,
    precision: 'highp',
    powerPreference: 'high-performance',
    alpha: true 
})
renderer.setClearColor(0x000000, 0)
renderer.setSize( window.innerWidth, window.innerHeight )
// renderer.devicePixelRatio = window.devicePixelRatio
renderer.setPixelRatio( window.devicePixelRatio )

document.body.appendChild(renderer.domElement);

const scene = new THREE.Scene()
const camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 0.1, 10000);

let atmosphere, c, diffuse, diffuseNight, f, fragmentGround, fragmentSky, g, ground, maxAnisotropy, radius, render, sky, uniforms, vertexGround, vertexSky;

const DISTANCE = 5

vertexSky = [
    "// Atmospheric scattering vertex shader",
    "// Author: Sean O'Neil",
    "// Copyright (c) 2004 Sean O'Neil",
    "uniform vec3 v3LightPosition;          // The direction vector to the light source",
    "uniform vec3 v3InvWavelength;	        // 1 / pow(wavelength, 4) for the red, green, and blue channels",
    "uniform float fCameraHeight;	        // The camera's current height",
    "uniform float fCameraHeight2;	        // fCameraHeight^2",
    "uniform float fOuterRadius;	        // The outer (atmosphere) radius",
    "uniform float fOuterRadius2;	        // fOuterRadius^2",
    "uniform float fInnerRadius;	        // The inner (planetary) radius",
    "uniform float fInnerRadius2;	        // fInnerRadius^2",
    "uniform float fKrESun;			        // Kr * ESun",
    "uniform float fKmESun;			        // Km * ESun",
    "uniform float fKr4PI;			        // Kr * 4 * PI",
    "uniform float fKm4PI;			        // Km * 4 * PI",
    "uniform float fScale;			        // 1 / (fOuterRadius - fInnerRadius)",
    "uniform float fScaleDepth;		        // The scale depth (i.e. the altitude at which the atmosphere's average density is found)",
    "uniform float...