|
@@ -138,6 +138,23 @@
|
|
|
container = document.createElement( 'div' );
|
|
|
document.body.appendChild( container );
|
|
|
|
|
|
+ // Make linear gradient texture
|
|
|
+ const data = new Uint8ClampedArray( 100 * 100 * 3 );
|
|
|
+ for ( let y = 0; y < 100; y ++ ) {
|
|
|
+
|
|
|
+ for ( let x = 0; x < 100; x ++ ) {
|
|
|
+
|
|
|
+ data[ 3 * ( 100 * y + x ) ] = Math.round( 255 * y / 99 );
|
|
|
+ data[ 3 * ( 100 * y + x ) + 1 ] = Math.round( 255 - 255 * y / 99 );
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ const gradientTexture = new THREE.DataTexture( data, 100, 100, THREE.RGBFormat );
|
|
|
+ gradientTexture.minFilter = THREE.LinearFilter;
|
|
|
+ gradientTexture.magFilter = THREE.LinearFilter;
|
|
|
+
|
|
|
scene1 = new THREE.Scene();
|
|
|
scene1.name = 'Scene1';
|
|
|
|
|
@@ -230,6 +247,7 @@
|
|
|
roughness: 1.0,
|
|
|
flatShading: true
|
|
|
} );
|
|
|
+ material.map = gradientTexture;
|
|
|
sphere = new THREE.Mesh( new THREE.SphereBufferGeometry( 70, 10, 10 ), material );
|
|
|
sphere.position.set( 0, 0, 0 );
|
|
|
sphere.name = "Sphere";
|