MeshToonMaterial: Removed shininess and specular/specularMap

docs/api/en/materials/MeshToonMaterial.html

@@ -164,26 +164,9 @@
 			Default is a [page:Vector2] set to (1,1).
 		</p>
 
-		<h3>[property:Float shininess]</h3>
-		<p>How shiny the [page:.specular] highlight is; a higher value gives a sharper highlight. Default is *30*.</p>
-
-
 		<h3>[property:Boolean skinning]</h3>
 		<p>Define whether the material uses skinning. Default is false.</p>
 
-		<h3>[property:Color specular]</h3>
-		<p>
-			Specular color of the material. Default is a [page:Color] set to *0x111111* (very dark grey).<br /><br />
-
-			This defines how shiny the material is and the color of its shine.
-		</p>
-
-		<h3>[property:Texture specularMap]</h3>
-		<p>
-			The specular map value affects both how much the specular surface highlight
-			contributes and how much of the environment map affects the surface. Default is null.
-		</p>
-
 		<h3>[property:Boolean wireframe]</h3>
 		<p>Render geometry as wireframe. Default is *false* (i.e. render as flat polygons).</p>
 

docs/api/zh/materials/MeshToonMaterial.html

@@ -165,26 +165,9 @@
 			Default is a [page:Vector2] set to (1,1).
 		</p>
 
-		<h3>[property:Float shininess]</h3>
-		<p>How shiny the [page:.specular] highlight is; a higher value gives a sharper highlight. Default is *30*.</p>
-
-
 		<h3>[property:Boolean skinning]</h3>
 		<p>Define whether the material uses skinning. Default is false.</p>
 
-		<h3>[property:Color specular]</h3>
-		<p>
-			Specular color of the material. Default is a [page:Color] set to *0x111111* (very dark grey).<br /><br />
-
-			This defines how shiny the material is and the color of its shine.
-		</p>
-
-		<h3>[property:Texture specularMap]</h3>
-		<p>
-			The specular map value affects both how much the specular surface highlight
-			contributes and how much of the environment map affects the surface. Default is null.
-		</p>
-
 		<h3>[property:Boolean wireframe]</h3>
 		<p>Render geometry as wireframe. Default is *false* (i.e. render as flat polygons).</p>
 

docs/scenes/material-browser.html

@@ -299,7 +299,7 @@
 
 			function updateCombine( material ) {
 
-				return function (combine) {
+				return function ( combine ) {
 
 					material.combine = parseInt( combine );
 					material.needsUpdate = true;

examples/webgl_materials_variations_toon.html

@@ -48,13 +48,6 @@
 
 				// Materials
 
-				var imgTexture = new THREE.TextureLoader().load( "textures/planets/moon_1024.jpg" );
-				imgTexture.wrapS = imgTexture.wrapT = THREE.RepeatWrapping;
-				imgTexture.encoding = THREE.sRGBEncoding;
-				imgTexture.anisotropy = 16;
-				imgTexture = null;
-
-				var bumpScale = 1;
 				var cubeWidth = 400;
 				var numberOfSphersPerSide = 5;
 				var sphereRadius = ( cubeWidth / numberOfSphersPerSide ) * 0.8 * 0.5;
@@ -64,11 +57,20 @@
 
 				for ( var alpha = 0, alphaIndex = 0; alpha <= 1.0; alpha += stepSize, alphaIndex ++ ) {
 
-					var specularShininess = Math.pow( 2, alpha * 10 );
+					var colors = new Uint8Array( alphaIndex + 2 );
 
-					for ( var beta = 0; beta <= 1.0; beta += stepSize ) {
+					for ( var c = 0; c <= colors.length; c ++ ) {
+
+						colors[ c ] = ( c / colors.length ) * 256;
+
+					}
+
+					var gradientMap = new THREE.DataTexture( colors, colors.length, 1, THREE.LuminanceFormat );
+					gradientMap.minFilter = THREE.NearestFilter;
+					gradientMap.magFilter = THREE.NearestFilter;
+					gradientMap.generateMipmaps = false;
 
-						var specularColor = new THREE.Color( beta * 0.2, beta * 0.2, beta * 0.2 );
+					for ( var beta = 0; beta <= 1.0; beta += stepSize ) {
 
 						for ( var gamma = 0; gamma <= 1.0; gamma += stepSize ) {
 
@@ -76,12 +78,8 @@
 							var diffuseColor = new THREE.Color().setHSL( alpha, 0.5, gamma * 0.5 + 0.1 ).multiplyScalar( 1 - beta * 0.2 );
 
 							var material = new THREE.MeshToonMaterial( {
-								map: imgTexture,
-								bumpMap: imgTexture,
-								bumpScale: bumpScale,
 								color: diffuseColor,
-								specular: specularColor,
-								shininess: specularShininess,
+								gradientMap: gradientMap
 							} );
 
 							var mesh = new THREE.Mesh( geometry, material );
@@ -110,18 +108,15 @@
 
 					} );
 
-					var textMaterial = new THREE.MeshBasicMaterial( { color: 0xffffff } );
+					var textMaterial = new THREE.MeshBasicMaterial();
 					var textMesh = new THREE.Mesh( textGeo, textMaterial );
 					textMesh.position.copy( location );
 					scene.add( textMesh );
 
 				}
 
-				addLabel( "-shininess", new THREE.Vector3( - 350, 0, 0 ) );
-				addLabel( "+shininess", new THREE.Vector3( 350, 0, 0 ) );
-
-				addLabel( "-specular", new THREE.Vector3( 0, - 300, 0 ) );
-				addLabel( "+specular", new THREE.Vector3( 0, 300, 0 ) );
+				addLabel( "-gradentMap", new THREE.Vector3( - 350, 0, 0 ) );
+				addLabel( "+gradentMap", new THREE.Vector3( 350, 0, 0 ) );
 
 				addLabel( "-diffuse", new THREE.Vector3( 0, 0, - 300 ) );
 				addLabel( "+diffuse", new THREE.Vector3( 0, 0, 300 ) );
@@ -136,11 +131,11 @@
 
 				scene.add( new THREE.AmbientLight( 0x111111 ) );
 
-				var directionalLight = new THREE.DirectionalLight( 0xffffff, 1 );
+				var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
 				directionalLight.position.set( 1, 1, 1 ).normalize();
 				scene.add( directionalLight );
 
-				var pointLight = new THREE.PointLight( 0xffffff, 1, 800 );
+				var pointLight = new THREE.PointLight( 0xffffff, 1.25, 800 );
 				particleLight.add( pointLight );
 
 				//

src/materials/MeshToonMaterial.d.ts

@@ -7,8 +7,6 @@ import { NormalMapTypes } from '../constants';
 export interface MeshToonMaterialParameters extends MaterialParameters {
 	/** geometry color in hexadecimal. Default is 0xffffff. */
 	color?: Color | string | number;
-	specular?: Color | string | number;
-	shininess?: number;
 	opacity?: number;
 	gradientMap?: Texture | null;
 	map?: Texture | null;
@@ -27,7 +25,6 @@ export interface MeshToonMaterialParameters extends MaterialParameters {
 	displacementMap?: Texture | null;
 	displacementScale?: number;
 	displacementBias?: number;
-	specularMap?: Texture | null;
 	alphaMap?: Texture | null;
 	wireframe?: boolean;
 	wireframeLinewidth?: number;
@@ -43,8 +40,6 @@ export class MeshToonMaterial extends Material {
 	constructor( parameters?: MeshToonMaterialParameters );
 
 	color: Color;
-	specular: Color;
-	shininess: number;
 	gradientMap: Texture | null;
 	map: Texture | null;
 	lightMap: Texture | null;
@@ -62,7 +57,6 @@ export class MeshToonMaterial extends Material {
 	displacementMap: Texture | null;
 	displacementScale: number;
 	displacementBias: number;
-	specularMap: Texture | null;
 	alphaMap: Texture | null;
 	wireframe: boolean;
 	wireframeLinewidth: number;

src/materials/MeshToonMaterial.js

@@ -8,8 +8,6 @@ import { Color } from '../math/Color.js';
  *
  * parameters = {
  *  color: <hex>,
- *  specular: <hex>,
- *  shininess: <float>,
  *
  *  map: new THREE.Texture( <Image> ),
  *  gradientMap: new THREE.Texture( <Image> ),
@@ -35,8 +33,6 @@ import { Color } from '../math/Color.js';
  *  displacementScale: <float>,
  *  displacementBias: <float>,
  *
- *  specularMap: new THREE.Texture( <Image> ),
- *
  *  alphaMap: new THREE.Texture( <Image> ),
  *
  *  wireframe: <boolean>,
@@ -57,8 +53,6 @@ function MeshToonMaterial( parameters ) {
 	this.type = 'MeshToonMaterial';
 
 	this.color = new Color( 0xffffff );
-	this.specular = new Color( 0x111111 );
-	this.shininess = 30;
 
 	this.map = null;
 	this.gradientMap = null;
@@ -84,8 +78,6 @@ function MeshToonMaterial( parameters ) {
 	this.displacementScale = 1;
 	this.displacementBias = 0;
 
-	this.specularMap = null;
-
 	this.alphaMap = null;
 
 	this.wireframe = false;
@@ -111,8 +103,6 @@ MeshToonMaterial.prototype.copy = function ( source ) {
 	Material.prototype.copy.call( this, source );
 
 	this.color.copy( source.color );
-	this.specular.copy( source.specular );
-	this.shininess = source.shininess;
 
 	this.map = source.map;
 	this.gradientMap = source.gradientMap;
@@ -138,8 +128,6 @@ MeshToonMaterial.prototype.copy = function ( source ) {
 	this.displacementScale = source.displacementScale;
 	this.displacementBias = source.displacementBias;
 
-	this.specularMap = source.specularMap;
-
 	this.alphaMap = source.alphaMap;
 
 	this.wireframe = source.wireframe;

src/renderers/shaders/ShaderChunk/lights_toon_fragment.glsl.js

@@ -1,7 +1,4 @@
 export default /* glsl */`
 ToonMaterial material;
 material.diffuseColor = diffuseColor.rgb;
-material.specularColor = specular;
-material.specularShininess = shininess;
-material.specularStrength = specularStrength;
 `;

src/renderers/shaders/ShaderChunk/lights_toon_pars_fragment.glsl.js

@@ -11,9 +11,6 @@ varying vec3 vViewPosition;
 struct ToonMaterial {
 
 	vec3	diffuseColor;
-	vec3	specularColor;
-	float	specularShininess;
-	float	specularStrength;
 
 };
 
@@ -29,8 +26,6 @@ void RE_Direct_Toon( const in IncidentLight directLight, const in GeometricConte
 
 	reflectedLight.directDiffuse += irradiance * BRDF_Diffuse_Lambert( material.diffuseColor );
 
-	reflectedLight.directSpecular += irradiance * BRDF_Specular_BlinnPhong( directLight, geometry, material.specularColor, material.specularShininess ) * material.specularStrength;
-
 }
 
 void RE_IndirectDiffuse_Toon( const in vec3 irradiance, const in GeometricContext geometry, const in ToonMaterial material, inout ReflectedLight reflectedLight ) {

src/renderers/shaders/ShaderLib.js

@@ -109,7 +109,6 @@ const ShaderLib = {
 
 		uniforms: mergeUniforms( [
 			UniformsLib.common,
-			UniformsLib.specularmap,
 			UniformsLib.aomap,
 			UniformsLib.lightmap,
 			UniformsLib.emissivemap,
@@ -120,9 +119,7 @@ const ShaderLib = {
 			UniformsLib.fog,
 			UniformsLib.lights,
 			{
-				emissive: { value: new Color( 0x000000 ) },
-				specular: { value: new Color( 0x111111 ) },
-				shininess: { value: 30 }
+				emissive: { value: new Color( 0x000000 ) }
 			}
 		] ),
 

src/renderers/shaders/ShaderLib/meshtoon_frag.glsl.js

@@ -3,8 +3,6 @@ export default /* glsl */`
 
 uniform vec3 diffuse;
 uniform vec3 emissive;
-uniform vec3 specular;
-uniform float shininess;
 uniform float opacity;
 
 #include <common>
@@ -26,7 +24,6 @@ uniform float opacity;
 #include <shadowmap_pars_fragment>
 #include <bumpmap_pars_fragment>
 #include <normalmap_pars_fragment>
-#include <specularmap_pars_fragment>
 #include <logdepthbuf_pars_fragment>
 #include <clipping_planes_pars_fragment>
 
@@ -43,7 +40,6 @@ void main() {
 	#include <color_fragment>
 	#include <alphamap_fragment>
 	#include <alphatest_fragment>
-	#include <specularmap_fragment>
 	#include <normal_fragment_begin>
 	#include <normal_fragment_maps>
 	#include <emissivemap_fragment>
@@ -57,7 +53,7 @@ void main() {
 	// modulation
 	#include <aomap_fragment>
 
-	vec3 outgoingLight = reflectedLight.directDiffuse + reflectedLight.indirectDiffuse + reflectedLight.directSpecular + reflectedLight.indirectSpecular + totalEmissiveRadiance;
+	vec3 outgoingLight = reflectedLight.directDiffuse + reflectedLight.indirectDiffuse + totalEmissiveRadiance;
 
 	gl_FragColor = vec4( outgoingLight, diffuseColor.a );
 

src/renderers/webgl/WebGLMaterials.js

@@ -437,9 +437,6 @@ function WebGLMaterials( properties ) {
 
 	function refreshUniformsToon( uniforms, material ) {
 
-		uniforms.specular.value.copy( material.specular );
-		uniforms.shininess.value = Math.max( material.shininess, 1e-4 ); // to prevent pow( 0.0, 0.0 )
-
 		if ( material.gradientMap ) {
 
 			uniforms.gradientMap.value = material.gradientMap;