How to use the AmbientLight function from three
Find comprehensive JavaScript three.AmbientLight code examples handpicked from public code repositorys.
THREE.AmbientLight is a class in the Three.js library that creates an ambient light source that illuminates all objects in a scene evenly.
GitHub: K3D-tools/K3D-jupyter
562 563 564 565 566 567 568 569 570 571
key: 0.4, head: 0.15, fill: 0.15, back: 0.1, }; const ambientLight = new THREE.AmbientLight(0xffffff); const grids = { planes: {}, labelsOnEdges: {}, };
GitHub: wkentaro/morefusion
![wkentaro profile picture](/wkentaro.png?size=40)
17 18 19 20 21 22 23 24 25 26
var div = document.getElementById("reconstruction-robotic-top-down") var camera = new THREE.PerspectiveCamera(30, 640 / 480, 0.01, 1000); robotic_top_down.resetCamera(); var ambientLight = new THREE.AmbientLight(0xffffff, 1.5); scene.add(ambientLight); // var pointLight = new THREE.PointLight(0xffffff, 1.5); // camera.add( pointLight );
How does three.AmbientLight work?
THREE.AmbientLight is a class in the Three.js library that is used to create an ambient light source, which illuminates all objects in a scene evenly. When an AmbientLight is added to a scene, it does not cast any shadows, and its light intensity does not vary based on its distance to an object. Instead, the AmbientLight creates a uniform illumination throughout the scene, simulating a natural environment without any direct sources of light. To create an AmbientLight object in Three.js, you simply need to instantiate the THREE.AmbientLight class and set the light color and intensity: javascript Copy code {{{{{{{ const ambientLight = new THREE.AmbientLight(0xffffff, 0.5); // color, intensity scene.add(ambientLight); In this example, we create a new AmbientLight with a white color and an intensity of 0.5. We then add the AmbientLight to the scene object to make it visible in the scene. AmbientLight objects can be combined with other light sources, such as directional lights or point lights, to create more complex lighting effects in a Three.js scene.
55 56 57 58 59 60 61 62 63 64
directionalLight1.position.set(0.2, 0.2, -1).normalize(); var directionalLight2 = new THREE.DirectionalLight(0xFFFFFF, 1.2); directionalLight2.position.set(0.2, 0.2, 1).normalize(); var ambientLight = new THREE.AmbientLight(0x202020); this.scene.add(directionalLight1); this.scene.add(directionalLight2); this.scene.add(ambientLight);
+ 20 other calls in file
GitHub: kentywang/Agamari
![kentywang profile picture](/kentywang.png?size=40)
116 117 118 119 120 121 122 123 124
shadowLight.shadow.mapSize.height = 512; scene.add(hemisphereLight); scene.add(shadowLight); ambientLight = new THREE.AmbientLight(someColors['green'], 0.5); scene.add(ambientLight); loadGame();
+ 15 other calls in file
Ai Example
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32
// Create a new Three.js scene const scene = new THREE.Scene(); // Create a new camera and add it to the scene const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 ); scene.add(camera); // Create a new renderer and add it to the page const renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); // Create an AmbientLight and add it to the scene const ambientLight = new THREE.AmbientLight(0xffffff, 0.5); // color, intensity scene.add(ambientLight); // Create a cube and add it to the scene const geometry = new THREE.BoxGeometry(); const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); const cube = new THREE.Mesh(geometry, material); scene.add(cube); // Move the camera back from the cube camera.position.z = 5; // Render the scene renderer.render(scene, camera);
In this example, we create a new Three.js scene and add a camera and renderer to it. We then create a new AmbientLight with a white color and an intensity of 0.5, and add it to the scene using the add method. After that, we create a green cube and add it to the scene, and move the camera back so that the cube is visible. Finally, we call the render method on the renderer object to render the scene. The AmbientLight we added to the scene illuminates the cube with a soft, uniform light, while the green color of the cube remains visible.
GitHub: VCityTeam/UD-Viz
112 113 114 115 116 117 118 119 120 121
directionalLight.position.set(100, 100, 500); directionalLight.target.position.set(0, 0, 0); directionalLight.updateMatrixWorld(); scene.add(directionalLight); const ambientLight = new THREE.AmbientLight(0xffffff, 0.3); scene.add(ambientLight); return { directionalLight: directionalLight, ambientLight: ambientLight }; },
+ 4 other calls in file
GitHub: hobuinc/usgs-lidar
1174 1175 1176 1177 1178 1179 1180 1181 1182 1183
// world scene = new THREE.Scene(); // ambiently light our scale objects var l = new THREE.AmbientLight(0xffffff); scene.add(l); renderer = new THREE.WebGLRenderer( { antialias: false } ); renderer.setSize(w, h);
GitHub: ASSERT-KTH/ci-hackathon
60 61 62 63 64 65 66 67 68
scene.add( cube ); } function addAmbienLigth(){ //var light = new THREE.AmbientLight( 0xffffff ); // soft white light var light = new THREE.AmbientLight( 0x222222 ); // soft white light scene.add( light ); }
+ 5 other calls in file
20 21 22 23 24 25 26 27 28 29
if (httpRequest.status === 200) { var xmlText = httpRequest.responseText; var loader = new THREE.X3DLoader(); const scene = loader.parse(xmlText); var light = new THREE.AmbientLight( 0x404040 ); // soft white light scene.add( light ); renderer.render(scene, camera); } else { alert('There was a problem with the request.');
GitHub: anthill/city-core
![anthill profile picture](/anthill.png?size=40)
65 66 67 68 69 70 71 72 73 74
controlsButton.addEventListener('click', toggleControls); // Add event listeners lightButton.addEventListener('click', function(){ var greenLight = new THREE.AmbientLight("#004400"); bordeaux3D.addLight(greenLight); }); meshButton.addEventListener('click', function(){
3393 3394 3395 3396 3397 3398 3399 3400 3401 3402
let light = new THREE.AmbientLight( 0xffffff, 0.5 ); // soft white light this.scene.add( light ); const directionalLight = new THREE.DirectionalLight( 0xffffff, .5 ); directionalLight.position.set( 1, 1, 1 );
+ 17 other calls in file
GitHub: audunsh/evince
306 307 308 309 310 311 312 313 314 315
let light = new THREE.AmbientLight( 0x202020, 5 ); // soft white light this.scene.add( light ); const directionalLight = new THREE.DirectionalLight( 0xffffff, .5 ); directionalLight.position.set( 1, 1, 1 );
GitHub: audunsh/evince
177 178 179 180 181 182 183 184 185
/* let directionalLight = new THREE.DirectionalLight( 0x555555, .5 ); directionalLight.position.set( 1, 1, 1 ); this.scene.add( directionalLight ); let alight = new THREE.AmbientLight( 0x202020, .1 ); // soft white light this.scene.add( alight ); */
+ 2 other calls in file
GitHub: audunsh/evince
147 148 149 150 151 152 153 154 155
let directionalLight = new THREE.DirectionalLight( 0xffffff, .5 ); directionalLight.position.set( 1, 1, 1 ); this.scene.add( directionalLight ); //let alight = new THREE.AmbientLight( 0x202020, 5 ); // soft white light //this.scene.add( alight );
468 469 470 471 472 473 474 475 476 477
}); this.renderer.setSize(screenResolution.x, screenResolution.y); this.composer = new EffectComposer.EffectComposer(this.renderer); } setupLighting(scene) { const ambientLight = new THREE.AmbientLight(0xffffff, 0.8); scene.add(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 1); directionalLight.name = 'Light'; directionalLight.position.set(0, 100, 0);
+ 12 other calls in file
GitHub: gracexu94/FinalProject
144 145 146 147 148 149 150 151 152 153
camera.position.set(5, 5, 5); camera.lookAt(new THREE.Vector3(0,0,0)); var scene = new THREE.Scene(); scene.background = new THREE.Color( 'whitesmoke' ); scene.add(new THREE.AmbientLight(0x333333)); var controls = new OrbitControls(camera, framework.renderer.domElement); controls.enableDamping = true; controls.enableZoom = true;
+ 11 other calls in file
GitHub: scottlawsonbc/stldiff
![scottlawsonbc profile picture](/scottlawsonbc.png?size=40)
9 10 11 12 13 14 15 16 17 18
const loader = new STLLoader(); const camera = new THREE.PerspectiveCamera(75, 1, 0.1, 2000); const controls = new OrbitControls(camera, renderer.domElement); function initLight() { const ambientLight = new THREE.AmbientLight(0xb2b2b2); scene.add(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5); directionalLight.position.x = 1;
130 131 132 133 134 135 136 137 138 139
/** * return {SpotLight} */ initLight() { // 环境光-均匀的照亮场景中的所有物体,不能投射阴影 const Alight = new THREE.AmbientLight(0x404040) this.scene.add(Alight) // 添加聚光灯 const light = new THREE.SpotLight({ color: '#fff' })
GitHub: juanuys/boids
52 53 54 55 56 57 58 59 60 61
} // LIGHTS //ambient light scene.add(new THREE.AmbientLight(0xffffff, 0.5)); light = new THREE.PointLight(0xffffff, 0.5, 500); light.position.set(0, 100, 0); scene.add(light);
GitHub: audunsh/evince
397 398 399 400 401 402 403 404 405 406
this.scene.add(bondMesh); let light = new THREE.AmbientLight( 0xffffff, 0.8 ); // soft white light this.scene.add( light ); const directionalLight = new THREE.DirectionalLight( 0xffffff, .5 ); directionalLight.position.set( 1, 1, 1 );
+ 2 other calls in file
116 117 118 119 120 121 122 123 124 125 126 127
//load a texture loader var loader = new THREE.TextureLoader( ); loader.crossOrigin = true; //add a light const ambientLight = new THREE.AmbientLight(0xffffff, 0.9); SCENE.add(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 0.6); directionalLight.position.set(10, 20, 0); // x, y, z
three.Vector3 is the most popular function in three (22341 examples)