Replaced dir light with point light

mrdoob · Apr 14, 2019 · 92d2dec · 92d2dec
1 parent 4226a42
commit 92d2dec
Showing 1 changed file with 31 additions and 10 deletions.
diff --git a/examples/webgl_geometry_colors_lookuptable.html b/examples/webgl_geometry_colors_lookuptable.html
@@ -55,7 +55,7 @@
 
  var perpCamera, orthoCamera, renderer, lut;
 
- var mesh;
+ var mesh, pointLight;
  var scene, uiScene;
 
  var params, verticalLegendGroup, horizontalLegendGroup;
@@ -89,7 +89,13 @@
  orthoCamera = new THREE.OrthographicCamera( - 6, 6, 2, - 2, 1, 10 );
  orthoCamera.position.set( 3, 0, 10 );
 
- var ambientLight = new THREE.AmbientLight( 0x444444 );
+ params = {
+ colorMap: 'rainbow',
+ legendLayout: 'vertical',
+ moveLight: false
+ };
+
+ var ambientLight = new THREE.AmbientLight( 0x444444, 1.7 );
  scene.add( ambientLight );
 
  mesh = new THREE.Mesh( undefined, new THREE.MeshLambertMaterial( {
@@ -101,15 +107,11 @@
 
  lut = new THREE.Lut();
 
- params = {
- colorMap: 'rainbow',
- legendLayout: 'vertical'
- };
  loadModel( );
 
- var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.7 );
- directionalLight.position.set( 17, 9, 30 );
- scene.add( directionalLight );
+ pointLight = new THREE.PointLight( 0xffffff, 1 );
+ pointLight.position.set( 2, 0, 1 );
+ scene.add( pointLight );
 
  renderer = new THREE.WebGLRenderer( { antialias: true } );
  renderer.autoClear = false;
@@ -123,6 +125,7 @@
  controls.addEventListener( 'change', render );
 
  var gui = new dat.GUI();
+ gui.width = 350;
 
  gui.add( params, 'legendLayout', [ 'vertical', 'horizontal' ] ).onChange( function () {
 
@@ -138,6 +141,11 @@
 
  } );
 
+ var folder = gui.addFolder( 'light' );
+ folder.add( pointLight, 'intensity', 0, 3 ).step( 0.1 ).name( 'Point Light Intensity' ).onChange( render );
+ folder.add( ambientLight, 'intensity', 0, 3 ).step( 0.1 ).name( 'Ambient Light Intensity' ).onChange( render );
+ folder.add( params, 'moveLight' ).onChange( animate );
+
  }
 
  function onWindowResize() {
@@ -153,6 +161,20 @@
 
  }
 
+ function animate() {
+
+ if ( params.moveLight ) {
+
+ requestAnimationFrame( animate );
+
+ var t = Date.now() / 250;
+ pointLight.position.set( Math.cos( t ), Math.sin( t ) * 2, Math.cos( t / 4 ) ).multiplyScalar( 2 );
+ render();
+
+ }
+
+ }
+
  function render() {
 
  renderer.clear();
@@ -293,7 +315,6 @@
 
  }
 
-
  </script>
 
  </body>