diff --git a/examples/webgl_shaders_ocean.html b/examples/webgl_shaders_ocean.html index 7f9df7a91e1047..5920d1f525a14f 100644 --- a/examples/webgl_shaders_ocean.html +++ b/examples/webgl_shaders_ocean.html @@ -34,7 +34,7 @@ import { Sky } from 'three/addons/objects/Sky.js'; import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js'; - let container, stats; + let container, stats, timer; let camera, scene, renderer; let controls, water, sun, sky, mesh, bloomPass; @@ -67,6 +67,8 @@ camera = new THREE.PerspectiveCamera( 55, window.innerWidth / window.innerHeight, 1, 20000 ); camera.position.set( 30, 30, 100 ); + timer = new THREE.Timer(); + // sun = new THREE.Vector3(); @@ -217,6 +219,7 @@ function animate() { + timer.update(); render(); stats.update(); @@ -230,7 +233,9 @@ mesh.rotation.x = time * 0.5; mesh.rotation.z = time * 0.51; - water.material.uniforms[ 'time' ].value += 1.0 / 60.0; + const delta = timer.getDelta(); + + water.material.uniforms[ 'time' ].value += delta; sky.material.uniforms[ 'time' ].value = time; renderer.render( scene, camera );