Browse Source

Examples: Improve `webgpu_lights_custom` example (#29279)

* improve custom lights example

* update

* puppeteer: added `webgpu_lights_custom`

* Revert "puppeteer: added `webgpu_lights_custom`"

This reverts commit 92ca90f2837810db23047e338c1f267138e42bcc.

* screenshot generate by e2e
sunag 1 year ago
parent
commit
5117abbcd8

BIN
examples/screenshots/webgpu_lights_custom.jpg


+ 7 - 8
examples/webgpu_lights_custom.html

@@ -50,21 +50,20 @@
 				camera.position.z = 1.5;
 				camera.position.z = 1.5;
 
 
 				scene = new THREE.Scene();
 				scene = new THREE.Scene();
-				scene.background = new THREE.Color( 0x222222 );
 
 
 				// lights
 				// lights
 
 
-				const sphereGeometry = new THREE.SphereGeometry( 0.01, 16, 8 );
+				const sphereGeometry = new THREE.SphereGeometry( 0.02, 16, 8 );
 
 
 				const addLight = ( hexColor ) => {
 				const addLight = ( hexColor ) => {
 
 
-					const material = new THREE.MeshStandardNodeMaterial();
+					const material = new THREE.NodeMaterial();
 					material.colorNode = color( hexColor );
 					material.colorNode = color( hexColor );
 					material.lightsNode = lights(); // ignore scene lights
 					material.lightsNode = lights(); // ignore scene lights
 
 
 					const mesh = new THREE.Mesh( sphereGeometry, material );
 					const mesh = new THREE.Mesh( sphereGeometry, material );
 
 
-					const light = new THREE.PointLight( hexColor, 0.1, 0.8 );
+					const light = new THREE.PointLight( hexColor, 0.1, 1 );
 					light.add( mesh );
 					light.add( mesh );
 
 
 					scene.add( light );
 					scene.add( light );
@@ -85,9 +84,9 @@
 
 
 				const points = [];
 				const points = [];
 
 
-				for ( let i = 0; i < 1_000_000; i ++ ) {
+				for ( let i = 0; i < 500_000; i ++ ) {
 
 
-					const point = new THREE.Vector3().random().subScalar( 0.5 ).multiplyScalar( 2 );
+					const point = new THREE.Vector3().random().subScalar( 0.5 ).multiplyScalar( 3 );
 					points.push( point );
 					points.push( point );
 
 
 				}
 				}
@@ -138,7 +137,7 @@
 
 
 			function animate() {
 			function animate() {
 
 
-				const time = Date.now() * 0.0005;
+				const time = Date.now() * 0.001;
 				const scale = .5;
 				const scale = .5;
 
 
 				light1.position.x = Math.sin( time * 0.7 ) * scale;
 				light1.position.x = Math.sin( time * 0.7 ) * scale;
@@ -153,7 +152,7 @@
 				light3.position.y = Math.cos( time * 0.3 ) * scale;
 				light3.position.y = Math.cos( time * 0.3 ) * scale;
 				light3.position.z = Math.sin( time * 0.5 ) * scale;
 				light3.position.z = Math.sin( time * 0.5 ) * scale;
 
 
-				scene.rotation.y = time * 0.6;
+				scene.rotation.y = time * 0.1;
 
 
 				renderer.render( scene, camera );
 				renderer.render( scene, camera );
 
 

粤ICP备19079148号