Skip to content

T
three.js

车家大少爷 / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 16a84196 编写于 作者: B Brian Chirls 提交者： Mr.doob
浏览文件
操作

Optimize Sky Shader (#9684) 

- Move computation from fragment shader to vertex shader wherever possible
- Eliminate some dead shader code and comments
- Fix spelling of "Rayleigh"
上级 c1b8d4c9
隐藏空白更改
内联 并排
Showing with 100 addition and 137 deletion
examples/js/SkyShader.js
浏览文件 @ 16a84196
......@@ -20,7 +20,7 @@ THREE.ShaderLib[ 'sky' ] = {
luminance: { value: 1 },
turbidity: { value: 2 },
reileigh: { value: 1 },
rayleigh: { value: 1 },
mieCoefficient: { value: 0.005 },
mieDirectionalG: { value: 0.8 },
sunPosition: { value: new THREE.Vector3() }
......@@ -29,7 +29,51 @@ THREE.ShaderLib[ 'sky' ] = {
vertexShader: [
"uniform vec3 sunPosition;",
"uniform float rayleigh;",
"uniform float turbidity;",
"uniform float mieCoefficient;",
"varying vec3 vWorldPosition;",
"varying vec3 vSunDirection;",
"varying float vSunfade;",
"varying vec3 vBetaR;",
"varying vec3 vBetaM;",
"varying float vSunE;",
"const vec3 up = vec3(0.0, 1.0, 0.0);",
// constants for atmospheric scattering
"const float e = 2.71828182845904523536028747135266249775724709369995957;",
"const float pi = 3.141592653589793238462643383279502884197169;",
// mie stuff
// K coefficient for the primaries
"const float v = 4.0;",
"const vec3 K = vec3(0.686, 0.678, 0.666);",
// see http://blenderartists.org/forum/showthread.php?321110-Shaders-and-Skybox-madness
// A simplied version of the total Reayleigh scattering to works on browsers that use ANGLE
"const vec3 simplifiedRayleigh = 0.0005 / vec3(94, 40, 18);",
// wavelength of used primaries, according to preetham
"const vec3 lambda = vec3(680E-9, 550E-9, 450E-9);",
// earth shadow hack
"const float cutoffAngle = pi/1.95;",
"const float steepness = 1.5;",
"const float EE = 1000.0;",
"float sunIntensity(float zenithAngleCos)",
"{",
"return EE * max(0.0, 1.0 - pow(e, -((cutoffAngle - acos(zenithAngleCos))/steepness)));",
"}",
"vec3 totalMie(vec3 lambda, float T)",
"{",
"float c = (0.2 * T ) * 10E-18;",
"return 0.434 * c * pi * pow((2.0 * pi) / lambda, vec3(v - 2.0)) * K;",
"}",
"void main() {",
......@@ -38,85 +82,57 @@ THREE.ShaderLib[ 'sky' ] = {
"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
"vSunDirection = normalize(sunPosition);",
"vSunE = sunIntensity(dot(vSunDirection, up));",
"vSunfade = 1.0-clamp(1.0-exp((sunPosition.y/450000.0)),0.0,1.0);",
"float rayleighCoefficient = rayleigh - (1.0 * (1.0-vSunfade));",
// extinction (absorbtion + out scattering)
// rayleigh coefficients
"vBetaR = simplifiedRayleigh * rayleighCoefficient;",
// mie coefficients
"vBetaM = totalMie(lambda, turbidity) * mieCoefficient;",
"}",
].join( "\n" ),
fragmentShader: [
"uniform sampler2D skySampler;",
"uniform vec3 sunPosition;",
"varying vec3 vWorldPosition;",
"vec3 cameraPos = vec3(0., 0., 0.);",
"// uniform sampler2D sDiffuse;",
"// const float turbidity = 10.0; //",
"// const float reileigh = 2.; //",
"// const float luminance = 1.0; //",
"// const float mieCoefficient = 0.005;",
"// const float mieDirectionalG = 0.8;",
"varying vec3 vSunDirection;",
"varying float vSunfade;",
"varying vec3 vBetaR;",
"varying vec3 vBetaM;",
"varying float vSunE;",
"uniform float luminance;",
"uniform float turbidity;",
"uniform float reileigh;",
"uniform float mieCoefficient;",
"uniform float mieDirectionalG;",
"// constants for atmospheric scattering",
"const float e = 2.71828182845904523536028747135266249775724709369995957;",
"const float pi = 3.141592653589793238462643383279502884197169;",
"const vec3 cameraPos = vec3(0., 0., 0.);",
"const float n = 1.0003; // refractive index of air",
"const float N = 2.545E25; // number of molecules per unit volume for air at",
"// 288.15K and 1013mb (sea level -45 celsius)",
"const float pn = 0.035; // depolatization factor for standard air",
"// wavelength of used primaries, according to preetham",
"const vec3 lambda = vec3(680E-9, 550E-9, 450E-9);",
// constants for atmospheric scattering
"const float pi = 3.141592653589793238462643383279502884197169;",
"// mie stuff",
"// K coefficient for the primaries",
"const vec3 K = vec3(0.686, 0.678, 0.666);",
"const float v = 4.0;",
"const float n = 1.0003;", // refractive index of air
"const float N = 2.545E25;", // number of molecules per unit volume for air at
// 288.15K and 1013mb (sea level -45 celsius)
"// optical length at zenith for molecules",
// optical length at zenith for molecules
"const float rayleighZenithLength = 8.4E3;",
"const float mieZenithLength = 1.25E3;",
"const vec3 up = vec3(0.0, 1.0, 0.0);",
"const float EE = 1000.0;",
"const float sunAngularDiameterCos = 0.999956676946448443553574619906976478926848692873900859324;",
"// 66 arc seconds -> degrees, and the cosine of that",
"// earth shadow hack",
"const float cutoffAngle = pi/1.95;",
"const float steepness = 1.5;",
"vec3 totalRayleigh(vec3 lambda)",
"{",
"return (8.0 * pow(pi, 3.0) * pow(pow(n, 2.0) - 1.0, 2.0) * (6.0 + 3.0 * pn)) / (3.0 * N * pow(lambda, vec3(4.0)) * (6.0 - 7.0 * pn));",
"}",
// see http://blenderartists.org/forum/showthread.php?321110-Shaders-and-Skybox-madness
"// A simplied version of the total Reayleigh scattering to works on browsers that use ANGLE",
"vec3 simplifiedRayleigh()",
"{",
"return 0.0005 / vec3(94, 40, 18);",
// return 0.00054532832366 / (3.0 * 2.545E25 * pow(vec3(680E-9, 550E-9, 450E-9), vec3(4.0)) * 6.245);
"}",
// 66 arc seconds -> degrees, and the cosine of that
"float rayleighPhase(float cosTheta)",
"{ ",
"return (3.0 / (16.0*pi)) * (1.0 + pow(cosTheta, 2.0));",
"// return (1.0 / (3.0*pi)) * (1.0 + pow(cosTheta, 2.0));",
"// return (3.0 / 4.0) * (1.0 + pow(cosTheta, 2.0));",
"}",
"vec3 totalMie(vec3 lambda, vec3 K, float T)",
"{",
"float c = (0.2 * T ) * 10E-18;",
"return 0.434 * c * pi * pow((2.0 * pi) / lambda, vec3(v - 2.0)) * K;",
"return (3.0 / (16.0*pi)) * (1.0 + pow(cosTheta, 2.0));",
"}",
"float hgPhase(float cosTheta, float g)",
......@@ -124,27 +140,15 @@ THREE.ShaderLib[ 'sky' ] = {
"return (1.0 / (4.0*pi)) * ((1.0 - pow(g, 2.0)) / pow(1.0 - 2.0*g*cosTheta + pow(g, 2.0), 1.5));",
"}",
"float sunIntensity(float zenithAngleCos)",
"{",
// This function originally used `exp(n)`, but it returns an incorrect value
// on Samsung S6 phones. So it has been replaced with the equivalent `pow(e, n)`.
// See https://github.com/mrdoob/three.js/issues/8382
"return EE * max(0.0, 1.0 - pow(e, -((cutoffAngle - acos(zenithAngleCos))/steepness)));",
"}",
"// float logLuminance(vec3 c)",
"// {",
"// return log(c.r * 0.2126 + c.g * 0.7152 + c.b * 0.0722);",
"// }",
// Filmic ToneMapping http://filmicgames.com/archives/75
"const float A = 0.15;",
"const float B = 0.50;",
"const float C = 0.10;",
"const float D = 0.20;",
"const float E = 0.02;",
"const float F = 0.30;",
"// Filmic ToneMapping http://filmicgames.com/archives/75",
"float A = 0.15;",
"float B = 0.50;",
"float C = 0.10;",
"float D = 0.20;",
"float E = 0.02;",
"float F = 0.30;",
"float W = 1000.0;",
"const float whiteScale = 1.0748724675633854;", // 1.0 / Uncharted2Tonemap(1000.0)
"vec3 Uncharted2Tonemap(vec3 x)",
"{",
......@@ -154,83 +158,44 @@ THREE.ShaderLib[ 'sky' ] = {
"void main() ",
"{",
"float sunfade = 1.0-clamp(1.0-exp((sunPosition.y/450000.0)),0.0,1.0);",
"// luminance = 1.0 ;// vWorldPosition.y / 450000. + 0.5; //sunPosition.y / 450000. * 1. + 0.5;",
"// gl_FragColor = vec4(sunfade, sunfade, sunfade, 1.0);",
"float reileighCoefficient = reileigh - (1.0* (1.0-sunfade));",
"vec3 sunDirection = normalize(sunPosition);",
"float sunE = sunIntensity(dot(sunDirection, up));",
"// extinction (absorbtion + out scattering) ",
"// rayleigh coefficients",
// "vec3 betaR = totalRayleigh(lambda) * reileighCoefficient;",
"vec3 betaR = simplifiedRayleigh() * reileighCoefficient;",
"// mie coefficients",
"vec3 betaM = totalMie(lambda, K, turbidity) * mieCoefficient;",
"// optical length",
"// cutoff angle at 90 to avoid singularity in next formula.",
// optical length
// cutoff angle at 90 to avoid singularity in next formula.
"float zenithAngle = acos(max(0.0, dot(up, normalize(vWorldPosition - cameraPos))));",
"float sR = rayleighZenithLength / (cos(zenithAngle) + 0.15 * pow(93.885 - ((zenithAngle * 180.0) / pi), -1.253));",
"float sM = mieZenithLength / (cos(zenithAngle) + 0.15 * pow(93.885 - ((zenithAngle * 180.0) / pi), -1.253));",
// combined extinction factor
"vec3 Fex = exp(-(vBetaR * sR + vBetaM * sM));",
"// combined extinction factor ",
"vec3 Fex = exp(-(betaR * sR + betaM * sM));",
"// in scattering",
"float cosTheta = dot(normalize(vWorldPosition - cameraPos), sunDirection);",
// in scattering
"float cosTheta = dot(normalize(vWorldPosition - cameraPos), vSunDirection);",
"float rPhase = rayleighPhase(cosTheta*0.5+0.5);",
"vec3 betaRTheta = betaR * rPhase;",
"vec3 betaRTheta = vBetaR * rPhase;",
"float mPhase = hgPhase(cosTheta, mieDirectionalG);",
"vec3 betaMTheta = betaM * mPhase;",
"vec3 betaMTheta = vBetaM * mPhase;",
"vec3 Lin = pow(sunE * ((betaRTheta + betaMTheta) / (betaR + betaM)) * (1.0 - Fex),vec3(1.5));",
"Lin *= mix(vec3(1.0),pow(sunE * ((betaRTheta + betaMTheta) / (betaR + betaM)) * Fex,vec3(1.0/2.0)),clamp(pow(1.0-dot(up, sunDirection),5.0),0.0,1.0));",
"vec3 Lin = pow(vSunE * ((betaRTheta + betaMTheta) / (vBetaR + vBetaM)) * (1.0 - Fex),vec3(1.5));",
"Lin *= mix(vec3(1.0),pow(vSunE * ((betaRTheta + betaMTheta) / (vBetaR + vBetaM)) * Fex,vec3(1.0/2.0)),clamp(pow(1.0-dot(up, vSunDirection),5.0),0.0,1.0));",
"//nightsky",
//nightsky
"vec3 direction = normalize(vWorldPosition - cameraPos);",
"float theta = acos(direction.y); // elevation --> y-axis, [-pi/2, pi/2]",
"float phi = atan(direction.z, direction.x); // azimuth --> x-axis [-pi/2, pi/2]",
"vec2 uv = vec2(phi, theta) / vec2(2.0*pi, pi) + vec2(0.5, 0.0);",
"// vec3 L0 = texture2D(skySampler, uv).rgb+0.1 * Fex;",
"vec3 L0 = vec3(0.1) * Fex;",
"// composition + solar disc",
"//if (cosTheta > sunAngularDiameterCos)",
// composition + solar disc
"float sundisk = smoothstep(sunAngularDiameterCos,sunAngularDiameterCos+0.00002,cosTheta);",
"// if (normalize(vWorldPosition - cameraPos).y>0.0)",
"L0 += (sunE * 19000.0 * Fex)*sundisk;",
"L0 += (vSunE * 19000.0 * Fex)*sundisk;",
"vec3 whiteScale = 1.0/Uncharted2Tonemap(vec3(W));",
"vec3 texColor = (Lin+L0); ",
"texColor *= 0.04 ;",
"texColor += vec3(0.0,0.001,0.0025)*0.3;",
"float g_fMaxLuminance = 1.0;",
"float fLumScaled = 0.1 / luminance; ",
"float fLumCompressed = (fLumScaled * (1.0 + (fLumScaled / (g_fMaxLuminance * g_fMaxLuminance)))) / (1.0 + fLumScaled); ",
"float ExposureBias = fLumCompressed;",
"vec3 texColor = (Lin+L0) * 0.04 + vec3(0.0, 0.0003, 0.00075);",
"vec3 curr = Uncharted2Tonemap((log2(2.0/pow(luminance,4.0)))*texColor);",
"vec3 color = curr*whiteScale;",
"vec3 retColor = pow(color,vec3(1.0/(1.2+(1.2*sunfade))));",
"vec3 retColor = pow(color,vec3(1.0/(1.2+(1.2*vSunfade))));",
"gl_FragColor.rgb = retColor;",
......@@ -256,7 +221,6 @@ THREE.Sky = function () {
var skyGeo = new THREE.SphereBufferGeometry( 450000, 32, 15 );
var skyMesh = new THREE.Mesh( skyGeo, skyMat );
// Expose variables
this.mesh = skyMesh;
this.uniforms = skyUniforms;
......
examples/webgl_shaders_sky.html
浏览文件 @ 16a84196
......@@ -50,7 +50,6 @@
<script src="js/Detector.js"></script>
<script src="js/libs/dat.gui.min.js"></script>
<script>
......@@ -84,7 +83,7 @@
var effectController = {
turbidity: 10,
reileigh: 2,
rayleigh: 2,
mieCoefficient: 0.005,
mieDirectionalG: 0.8,
luminance: 1,
......@@ -99,7 +98,7 @@
var uniforms = sky.uniforms;
uniforms.turbidity.value = effectController.turbidity;
uniforms.reileigh.value = effectController.reileigh;
uniforms.rayleigh.value = effectController.rayleigh;
uniforms.luminance.value = effectController.luminance;
uniforms.mieCoefficient.value = effectController.mieCoefficient;
uniforms.mieDirectionalG.value = effectController.mieDirectionalG;
......@@ -122,7 +121,7 @@
var gui = new dat.GUI();
gui.add( effectController, "turbidity", 1.0, 20.0, 0.1 ).onChange( guiChanged );
gui.add( effectController, "reileigh", 0.0, 4, 0.001 ).onChange( guiChanged );
gui.add( effectController, "rayleigh", 0.0, 4, 0.001 ).onChange( guiChanged );
gui.add( effectController, "mieCoefficient", 0.0, 0.1, 0.001 ).onChange( guiChanged );
gui.add( effectController, "mieDirectionalG", 0.0, 1, 0.001 ).onChange( guiChanged );
gui.add( effectController, "luminance", 0.0, 2 ).onChange( guiChanged );
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或