diff --git a/examples/webgl_shaders_ocean.html b/examples/webgl_shaders_ocean.html
index 6371ce8b27a413..298cf4ab37464d 100644
--- a/examples/webgl_shaders_ocean.html
+++ b/examples/webgl_shaders_ocean.html
@@ -94,20 +94,20 @@
skyUniforms[ 'mieDirectionalG' ].value = 0.8;
const parameters = {
- inclination: 0.49,
- azimuth: 0.205
+ inclination: 0.02,
+ azimuth: 0.045
};
const pmremGenerator = new THREE.PMREMGenerator( renderer );
function updateSun() {
- const theta = Math.PI * ( parameters.inclination - 0.5 );
+ const theta = 0.5 * Math.PI * ( 1 - parameters.inclination );
const phi = 2 * Math.PI * ( parameters.azimuth - 0.5 );
- sun.x = Math.cos( phi );
- sun.y = Math.sin( phi ) * Math.sin( theta );
- sun.z = Math.sin( phi ) * Math.cos( theta );
+ sun.x = Math.sin( theta ) * Math.sin( phi );
+ sun.y = Math.cos( theta );
+ sun.z = Math.sin( theta ) * Math.cos( phi );
sky.material.uniforms[ 'sunPosition' ].value.copy( sun );
water.material.uniforms[ 'sunDirection' ].value.copy( sun ).normalize();
@@ -145,7 +145,7 @@
const gui = new GUI();
const folderSky = gui.addFolder( 'Sky' );
- folderSky.add( parameters, 'inclination', 0, 0.5, 0.0001 ).onChange( updateSun );
+ folderSky.add( parameters, 'inclination', - 1, 1, 0.0001 ).onChange( updateSun );
folderSky.add( parameters, 'azimuth', 0, 1, 0.0001 ).onChange( updateSun );
folderSky.open();
diff --git a/examples/webgl_shaders_sky.html b/examples/webgl_shaders_sky.html
index e7a2848fd36f4e..6eb427ffbd94d8 100644
--- a/examples/webgl_shaders_sky.html
+++ b/examples/webgl_shaders_sky.html
@@ -42,8 +42,8 @@
rayleigh: 3,
mieCoefficient: 0.005,
mieDirectionalG: 0.7,
- inclination: 0.49, // elevation / inclination
- azimuth: 0.25, // Facing front,
+ inclination: 0.02, // elevation / inclination
+ azimuth: 0, // Facing front
exposure: renderer.toneMappingExposure
};
@@ -55,12 +55,12 @@
uniforms[ "mieCoefficient" ].value = effectController.mieCoefficient;
uniforms[ "mieDirectionalG" ].value = effectController.mieDirectionalG;
- const theta = Math.PI * ( effectController.inclination - 0.5 );
+ const theta = 0.5 * Math.PI * ( 1 - effectController.inclination );
const phi = 2 * Math.PI * ( effectController.azimuth - 0.5 );
- sun.x = Math.cos( phi );
- sun.y = Math.sin( phi ) * Math.sin( theta );
- sun.z = Math.sin( phi ) * Math.cos( theta );
+ sun.x = Math.sin( theta ) * Math.sin( phi );
+ sun.y = Math.cos( theta );
+ sun.z = Math.sin( theta ) * Math.cos( phi );
uniforms[ "sunPosition" ].value.copy( sun );
@@ -75,7 +75,7 @@
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, "inclination", 0, 1, 0.0001 ).onChange( guiChanged );
+ gui.add( effectController, "inclination", -1, 1, 0.0001 ).onChange( guiChanged );
gui.add( effectController, "azimuth", 0, 1, 0.0001 ).onChange( guiChanged );
gui.add( effectController, "exposure", 0, 1, 0.0001 ).onChange( guiChanged );