俺也是剛開始學,好多地兒肯定不對還請見諒.

以下程式碼是THREE.JS 原始碼檔案中materials/MeshPhongMaterial.js檔案的註釋.

/**
 * @author mrdoob / http://mrdoob.com/
 * @author alteredq / http://alteredqualia.com/
 *
 * parameters = {
 *  color: <hex>,
 *  ambient: <hex>,
 *  emissive: <hex>,
 *  specular: <hex>,
 *  shininess: <float>,
 *  opacity: <float>,
 *
 *  map: new THREE.Texture( <Image> ),
 *
 *  lightMap: new THREE.Texture( <Image> ),
 *
 *  bumpMap: new THREE.Texture( <Image> ),
 *  bumpScale: <float>,
 *
 *  normalMap: new THREE.Texture( <Image> ),
 *  normalScale: <Vector2>,
 *
 *  specularMap: new THREE.Texture( <Image> ),
 *
 *  alphaMap: new THREE.Texture( <Image> ),
 *
 *  envMap: new THREE.TextureCube( [posx, negx, posy, negy, posz, negz] ),
 *  combine: THREE.Multiply,
 *  reflectivity: <float>,
 *  refractionRatio: <float>,
 *
 *  shading: THREE.SmoothShading,
 *  blending: THREE.NormalBlending,
 *  depthTest: <bool>,
 *  depthWrite: <bool>,
 *
 *  wireframe: <boolean>,
 *  wireframeLinewidth: <float>,
 *
 *  vertexColors: THREE.NoColors / THREE.VertexColors / THREE.FaceColors,
 *
 *  skinning: <bool>,
 *  morphTargets: <bool>,
 *  morphNormals: <bool>,
 *
 *	fog: <bool>
 * }
 */

/*
///MeshPhongMaterial方法根據引數parameters建立mesh(網格)的phong(馮氏)材質型別,表面有光澤的材質型別,計算每個畫素,
///parameters引數的格式看上面.MeshPhongMaterial物件的功能函式採用,定義構造的函式原型物件來實現.大部分屬性方法繼承自材質的基類Material.
*/
///<summary>MeshPhongMaterial</summary>
///<param name ="parameters" type="String">string型別的JSON格式材質屬性引數</param>
///<returns type="MeshPhongMaterial">返回MeshPhongMaterial,網格標準材質.</returns>
THREE.MeshPhongMaterial = function ( parameters ) {

	THREE.Material.call( this );

	this.color = new THREE.Color( 0xffffff ); // diffuse 漫射顏色,預設初始化為0xffffff,白色
	this.ambient = new THREE.Color( 0xffffff );	//環境色 ,預設初始化為0xffffff, 白色, 乘以環境光物件的顏色
	this.emissive = new THREE.Color( 0x000000 );	//自發光(熒光)顏色, 預設初始化為0x000000,黑色, 實體顏色,不受其他燈光的影響.
	this.specular = new THREE.Color( 0x111111 );	//高光色, 預設初始化為0x111111,灰色, 材質發光區域的顏色,比如設定為漫射顏色,亮度加大,材質更像金屬,設成灰色,使材質更像塑料.預設是灰色的.
	this.shininess = 30;	//高光的強度,預設是30, 數值越大,高光呈現出一個亮點.

	/*
			this.metal屬性所關聯的著色器語言.
			"	#ifdef METAL",

			"		gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * ambient + totalSpecular );",

			"	#else",
			"		gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * ambient ) + totalSpecular;",
	*/
	this.metal = false;		//是否是金屬????
							//TODO: 上面的註釋是metal屬性所對應的演算法,好像是對顏色的計算有些改變,具體有啥不同,有待研究.
	/*
		this.wrapAround和this.wrapRGB所關聯的著色器語言
							// diffuse散射

			"				#ifdef WRAP_AROUND",

			"					float spotDiffuseWeightFull = max( dot( normal, spotVector ), 0.0 );",
			"					float spotDiffuseWeightHalf = max( 0.5 * dot( normal, spotVector ) + 0.5, 0.0 );",

			"					vec3 spotDiffuseWeight = mix( vec3( spotDiffuseWeightFull ), vec3( spotDiffuseWeightHalf ), wrapRGB );",
								genType mix (genType x, genType y, genType a)、genType mix (genType x, genType y, float a)
								返回線性混合的x和y，如：x*(1−a)+y*a
			"				#else",

			"					float spotDiffuseWeight = max( dot( normal, spotVector ), 0.0 );",

			"				#endif",
	*/
	this.wrapAround = false;	//是否遮罩??
								//TODO: this.wrapAround和this.wrapRGB屬性有點含糊,還需要測試.
	this.wrapRGB = new THREE.Vector3( 1, 1, 1 );	//通過設定wrapRGB的數值,根據上面註釋中的公式,對材質顏色進行線性混合.

	this.map = null;	//普通貼圖貼圖,預設為null

	/*********************************為什麼要用Lightmapping**************************************************************************
	參考:http://blog.sina.com.cn/s/blog_5b6cb9500101cplo.html
	1.為什麼要用Lightmapping?

	簡單來說就是實時燈光計算十分耗時，隨著光源越多會倍增計算耗時。使用Lightmap模擬燈光帶來的效果，便不用去計算燈光，會帶來效能上
	的大大提升。當然你不用燈光效果也是沒問題的，具體還是看專案需求。最簡單的直接在3dmas或maya裡面烘培完貼圖頂點色也行。
	***************************************************************************************************************************/
	this.lightMap = null	//光照貼圖,預設為null;

	//所謂純色的凹凸貼圖就是如同浮雕效果一樣的影象。其顏色與線框色相同。如果按預設色的話則為黑（白）色（即：黑色螢幕時為白色，白色背景時為黑色。）如下面的浮雕效果，就是白色線框繪出的立方體而凹凸貼圖的。
	this.bumpMap = null;	//凹凸貼圖,預設為null
	this.bumpScale = 1;		//凹凸貼圖的紋理大小

	//法線貼圖就是在原物體的凹凸表面的每個點上均作法線，通過RGB顏色通道來標記法線的方向，你可以把它理解成與原凹凸表面平行的另一個不同的表面，但實際上它又只是一個光滑的平面。
	//對於視覺效果而言，它的效率比原有的凹凸表面更高，若在特定位置上應用光源，可以讓細節程度較低的表面生成高細節程度的精確光照方向和反射效果。
	this.normalMap = null;	//法線貼圖
	this.normalScale = new THREE.Vector2( 1, 1 );	//法線縮放,指定一個數值,將法線貼圖與網格大小進行匹配.
													//TODO:這裡有些含糊,先這樣理解.

	this.specularMap = null;	//高光貼圖,預設為null

	this.alphaMap = null;	//透明通道貼圖,預設為null

	this.envMap = null;	//環境貼圖,預設為null

	// TEXTURE CONSTANTS
	//紋理常量,用來設定材質混合模式,有
	//THREE.MultiplyOperation,  相乘,photoshop中的圖層混合翻譯成正片疊底
	//THREE.MixOperation,   //混合模式
	//THREE.AddOperation,   //增加模式
	//參考: http://avnpc.com/pages/photoshop-layer-blending-algorithm
	//參考:
	//TODO: 是不是還可以實現更多的模式?
	// Normal正常模式 
	// Dissolve溶解模式 
	// Dancing Dissolve動態溶解模式 
	// Darken變暗模式 
	// Multiply正片疊底模式 
	// Linear Burn線性加深模式 
	// Color Burn顏色加深模式 
	// Classic Color Burn為相容早版本的Color Burn模式 
	// Add增加模式 
	// Lighten變亮模式 
	// Screen螢幕模式 
	// Linear Dodge線性減淡模式 
	// Overlay疊加模式 
	// Soft Light柔光模式 
	// Hard Light強光模式 
	// Liner Light線性加光模式 
	// Vivid Light清晰加光模式 
	// Din Light阻光模式 
	// Hard Mix強光混合模式 
	// Difference差別模式 
	// Classic Difference相容老版本的差別模式 
	// Exclusion排除模式 
	// Hue色相模式 
	// Saturation飽和度模式 
	// Color顏色模式 
	// Luminosity高度模式。 
	// 上面所列的層模式，是通上下層的顏色通道混合產生影響變化，而下層的層模式則是通過層的Alpha通道影響混合變化。 
	// Stencil Alpha：Alpha通道模式 
	// Stencil Luma：亮度模式 
	// Slihouette Alpha：Alpha通道輪廓 
	// Slihouette Luma：亮度輪廓 
	// Alpha Add：Alpha新增 
	// Luminescent Premul：冷光模式。
	/****************混合模式公式***************************************************************************************************************

	Photoshop圖層混合模式計算公式大全 


	關於photoshop的圖層混合模式，大家一定都非常熟悉了，我在這裡把各種混合模式的計算公式都詳細的描述一便，希望能夠對大家理解圖層的混合模式
	有所幫助，編寫倉促，不足之處請多批評指正。


	混合模式可以將兩個圖層的色彩值緊密結合在一起，從而創造出大量的效果。在這些效果的背後實際是一些簡單的數學公式在起作用。下面我將介紹photoshop cs2
	中所有混合模式的數學計算公式。另外還介紹了不透明度。下面所介紹的公式僅適用於RGB影象。對於Lab顏色影象而言，這些公式將不再適用。



	Opacity 不透明度

	C=d*A+(1-d)*B

	相對於不透明度而言，其反義就是透明度。這兩個術語之間的關係就類似於正負之間的關係：100%的不透明度就是0%的透明度。該混合模式相對來說比較簡單，在該混合模式下，
	如果兩個圖層的疊放順序不一樣，其結果也是不一樣的（當然50%透明除外）。

	該公式中，A代表了上面圖層畫素的色彩值（A=畫素值/255），d表示該層的透明度，B代表下面圖層畫素的色彩值（B=畫素值/255），C代表了混合畫素的色彩
	值（真實的結果畫素值應該為255*C）。該公式也應用於層蒙板，在這種情況下，d代表了蒙板圖層中給定位置畫素的亮度，下同，不再敘述。



	Darken 變暗

	B<=A: C=B

	B>=A: C=A

	該模式通過比較上下層畫素後取相對較暗的畫素作為輸出，注意，每個不同的顏色通道的畫素都是獨立的進行比較，色彩值相對較小的作為輸出結果，
	下層表示疊放次序位於下面的那個圖層，上層表示疊放次序位於上面的那個圖層，下同，不再敘述。



	Lighten 變亮

	B<=A: C=A

	B>A: C=B

	該模式和前面的模式是相似，不同的是取色彩值較大的（也就是較亮的）作為輸出結果。 



	Multiply 正片疊底

	C=A*B

	該效果將兩層畫素的標準色彩值（基於0..1之間）相乘後輸出，其效果可以形容成：兩個幻燈片疊加在一起然後放映，透射光需要分別通過這兩個幻燈片，
	從而被削弱了兩次。



	Screen 濾色

	C=1-(1-A)*(1-B)也可以寫成 1-C=(1-A)*(1-B)

	該模式和上一個模式剛好相反，上下層畫素的標準色彩值反相後相乘後輸出，輸出結果比兩者的畫素值都將要亮（就好像兩臺投影機分別對其中一個圖層進行
	投影后，然後投射到同一個螢幕上）。從第二個公式中我們可以看出，如果兩個圖層反相後，採用Multiply模式混合，則將和對這兩個圖層採用Screen模式混合後反相的結果完全一樣。



	Color Dodge 顏色減淡

	C=B/(1-A)

	該模式下，上層的亮度決定了下層的暴露程度。如果上層越亮，下層獲取的光越多，也就是越亮。如果上層是純黑色，也就是沒有亮度，則根本不會影響下層。
	如果上層是純白色，則下層除了畫素為255的地方暴露外，其他地方全部為白色（也就是255，不暴露）。結果最黑的地方不會低於下層的畫素值。



	Color Burn 顏色加深

	C=1-(1-B)/A

	該模式和上一個模式剛好相反。如果上層越暗，則下層獲取的光越少，如果上層為全黑色，則下層越黑，如果上層為全白色，則根本不會影響下層。
	結果最亮的地方不會高於下層的畫素值。



	Linear Dodge 線形減淡

	C=A+B

	將上下層的色彩值相加。結果將更亮。



	Linear Burn 線形加深

	C=A+B-1

	如果上下層的畫素值之和小於255，輸出結果將會是純黑色。如果將上層反相，結果將是純粹的數學減。



	Overlay 疊加

	B<=0.5: C=2*A*B

	B>0.5: C=1-2*(1-A)*(1-B)

	依據下層色彩值的不同，該模式可能是Multiply，也可能是Screen模式。

	上層決定了下層中間色調偏移的強度。如果上層為50%灰，則結果將完全為下層畫素的值。如果上層比50%灰暗，則下層的中間色調的將向暗地方偏移，
	如果上層比50%灰亮，則下層的中間色調的將向亮地方偏移。對於上層比50%灰暗，下層中間色調以下的色帶變窄（原來為0~2*0.4*0.5，現在為0~2*0.3*0.5），
	中間色調以上的色帶變寬（原來為2*0.4*0.5~1，現在為2*0.3*0.5~1）。反之亦然。



	Hard Light 強光

	A<=0.5: C=2*A*B

	A>0.5: C=1-2*(1-A)*(1-B)

	該模式完全相對應於Overlay模式下，兩個圖層進行次序交換的情況。如過上層的顏色高於50%灰，則下層越亮，反之越暗。



	Soft Light 柔光

	A<=0.5: C=(2*A-1)*(B-B*B)+B

	A>0.5: C=(2*A-1)*(sqrt(B)-B)+B

	該模式類似上層以Gamma值範圍為2.0到0.5的方式來調製下層的色彩值。結果將是一個非常柔和的組合。



	Vivid Light 亮光

	A<=0.5: C=1-(1-B)/2*A

	A>0.5: C=B/(2*(1-A))

	該模式非常強烈的增加了對比度，特別是在高亮和陰暗處。可以認為是陰暗處應用Color Burn和高亮處應用Color Dodge。



	Linear Light 線形光

	C=B+2*A-1

	相對於前一種模式而言，該模式增加的對比度要弱些。其類似於Linear Burn,只不過是加深了上層的影響力。



	Pin Light 點光

	B<2*A-1: C=2*A-1

	2*A-1<B<2*A: C=B

	B>2*A: C=2*A

	該模式結果就是導致中間調幾乎是不變的下層，但是兩邊是Darken和Lighte年模式的組合。



	Hard Mix 實色混合

	A<1-B: C=0

	A>1-B: C=1

	該模式導致了最終結果僅包含6種基本顏色，每個通道要麼就是0，要麼就是255。



	Difference 差值

	C=|A-B|

	上下層色調的絕對值。該模式主要用於比較兩個不同版本的圖片。如果兩者完全一樣，則結果為全黑。



	Exclusion 排除

	C=A+B-2*A*B

	亮的圖片區域將導致另一層的反相，很暗的區域則將導致另一層完全沒有改變。


	Hue 色相

	HcScYc =HASBYB

	輸出影象的色調為上層，飽和度和亮度保持為下層。對於灰色上層，結果為去色的下層。



	Saturation 飽和度

	HcScYc =HBSAYB

	輸出影象的飽和度為上層，色調和亮度保持為下層。



	Color 顏色

	HcScYc =HASAYB

	輸出影象的亮度為下層，色調和飽和度保持為上層。



	Luminosity 亮度

	HcScYc =HBSBYA

	輸出影象的亮度為上層，色調和飽和度保持為下層。



	Dissolve 溶解

	該模式根本不是真正的溶解，因此並不是適合Dissolve這個稱謂，其表現僅僅和Normal類似。其從上層中隨機抽取一些畫素作為透明，
	使其可以看到下層，隨著上層透明度越低，可看到的下層區域越多。如果上層完全不透明，則效果和Normal不會有任何不同。
	******************************混合模式公式**************************************************************************************************/

	this.combine = THREE.MultiplyOperation;	//混合模式
	this.reflectivity = 1;	//反射率,預設為1
	this.refractionRatio = 0.98;	//折射率,預設為0.98

	this.fog = true;	//霧效,預設開啟


	// shading
	// 著色處理
	/*********************著色方式**************************************************************************
	著色方式
	         絕大多數的3D物體是由多邊形（polygon）所構成的，它們都必須經過某些著色處理的手續，才不會以線結構（wireframe）的方式顯示。
	         這些著色處理方式有差到好，依次主要分為FlatShading、GouraudShading、PhoneShading、ScanlineRenderer、Ray-Traced。
	        FlatShading（平面著色）
	            也叫做“恆量著色”，平面著色是最簡單也是最快速的著色方法，每個多邊形都會被指定一個單一且沒有變化的顏色。這種方法雖然會產生出不真實
	            的效果，不過它非常適用於快速成像及其它要求速度重於細緻度的場合，如：生成預覽動畫。

	        GouraudShading（高洛德著色/高氏著色）
	            這種著色的效果要好得多，也是在遊戲中使用最廣泛的一種著色方式。它可對3D模型各頂點的顏色進行平滑、融合處理，將每個多邊形上的每個點
	            賦以一組色調值，同時將多邊形著上較為順滑的漸變色，使其外觀具有更強烈的實時感和立體動感，不過其著色速度比平面著色慢得多。

	        PhoneShading（補色著色）
	            首先，找出每個多邊形頂點，然後根據內插值的方法，算出頂點間算連線上畫素的光影值，接著再次運用線性的插值處理，算出其他所有畫素高氏著
	            色在取樣計算時，只顧及每個多邊形頂點的光影效果，而補色著色卻會把所有的點都計算進去。

	        ScanlineRenderer（掃描線著色）
	            這是3ds Max的預設渲染方式，它是一種基於一組連續水平線的著色方式，由於它渲染速度較快，一般被使用在預覽場景中。

	        Ray-Traced（光線跟蹤著色）
	            光線跟蹤是真實按照物理照射光線的入射路徑投射在物體上，最終反射回攝象機所得到每一個畫素的真實值的著色演算法，由於它計算精確，所得到的
	            圖象效果優質，因此製作CG一定要使用該選項。

	        Radiosity（輻射著色）
	            這是一種類似光線跟蹤的特效。它通過制定在場景中光線的來源並且根據物體的位置和反射情況來計算從觀察者到光源的整個路徑上的光影效果。在
	            這條線路上，光線受到不同物體的相互影響，如：反射、吸收、折射等情況都被計算在內。


	        glShadeModel( GLenum mode )可以設定的著色模型有：GL_SMOOTH和GL_FLAT
	            GL_FLAT恆定著色：對點，直線或多邊形採用一種顏色進行繪製，整個圖元的顏色就是它的任何一點的顏色。
	            GL_SMOOTH平滑著色：用多種顏色進行繪製，每個頂點都是單獨進行處理的，各頂點和各圖元之間採用均勻插值。

	*********************著色方式**************************************************************************/
	this.shading = THREE.SmoothShading;//著色方式,THREE.SmoothShading平滑著色：用多種顏色進行繪製，每個頂點都是單獨進行處理的，各頂點和各圖元之間採用均勻插值。
										//還有以下幾種THREE.NoShading = 0;    //不著色???? 
										//THREE.FlatShading = 1;  //GL_FLAT恆定著色：對點，直線或多邊形採用一種顏色進行繪製，整個圖元的顏色就是它的任何一點的顏色。


	this.wireframe = false;			//以線框方式渲染幾何體.預設為false
	this.wireframeLinewidth = 1;		//線框的寬度.

	/*******************************************linecap和linejoin屬性詳解****************************************
	lineCap 屬性指定線段如何結束。只有繪製較寬線段時，它才有效。這個屬性的合法值如下表所示。預設值是："round"。
		值				含義
	"butt"		這個預設值指定了線段應該沒有線帽。線條的末點是平直的而且和線條的方向正交，這條線段在其端點之外沒有擴充套件。
	"round"		這個值指定了線段應該帶有一個半圓形的線帽，半圓的直徑等於線段的寬度，並且線段在端點之外擴充套件了線段寬度的一半。
	"square"	這個值表示線段應該帶有一個矩形線帽。這個值和 "butt" 一樣，但是線段擴充套件了自己的寬度的一半。

	lineJoin 屬性設定或返回所建立邊角的型別，當兩條線交匯時。
	註釋：值 "miter" 受 miterLimit 屬性的影響。
	預設值：	round
	值		描述
	bevel	建立斜角。
	round	建立圓角。
	miter	預設。建立尖角。
	********************************************linecap和linejoin屬性詳解****************************************/
	this.wireframeLinecap = 'round';	//線框的線段端點的樣式,預設為round,和html的canvas裡的屬性一樣也有"butt", "round", "square"
	this.wireframeLinejoin = 'round';	//線框的線段邊角的型別，當兩條線交匯時,預設為round,和html的canvas裡的屬性一樣也有"round", "bevel", "miter"
										//TODO: 要給線框設定線型怎麼辦?

	this.vertexColors = THREE.NoColors;

	this.skinning = false;		//定義材質是否使用蒙皮,預設初始化為false
	this.morphTargets = false;	//定義材質是否設定目標變形動畫,預設為false
	this.morphNormals = false;	//定義是否反轉(變換)法線,預設為false

	this.setValues( parameters );	//呼叫Material類的setValues方法,將引數parameters賦值給當前MeshPhongMaterial材質的屬性.

};

/*************************************************************
****下面是MeshPhongMaterial物件的方法屬性定義,繼承自Material
*************************************************************/
THREE.MeshPhongMaterial.prototype = Object.create( THREE.Material.prototype );

/*clone方法
///clone方法克隆MeshPhongMaterial物件,
*/
///<summary>clone</summary>
///<param name ="material" type="MeshPhongMaterial">MeshPhongMaterial物件,可有可無.</param>
///<returns type="MeshPhongMaterial">返回克隆的MeshPhongMaterial物件</returns>	
THREE.MeshPhongMaterial.prototype.clone = function () {
	//以下是將材質的屬性一一進行復制
	var material = new THREE.MeshPhongMaterial();

	THREE.Material.prototype.clone.call( this, material );

	material.color.copy( this.color );
	material.ambient.copy( this.ambient );
	material.emissive.copy( this.emissive );
	material.specular.copy( this.specular );
	material.shininess = this.shininess;

	material.metal = this.metal;

	material.wrapAround = this.wrapAround;
	material.wrapRGB.copy( this.wrapRGB );

	material.map = this.map;

	material.lightMap = this.lightMap;

	material.bumpMap = this.bumpMap;
	material.bumpScale = this.bumpScale;

	material.normalMap = this.normalMap;
	material.normalScale.copy( this.normalScale );

	material.specularMap = this.specularMap;

	material.alphaMap = this.alphaMap;

	material.envMap = this.envMap;
	material.combine = this.combine;
	material.reflectivity = this.reflectivity;
	material.refractionRatio = this.refractionRatio;

	material.fog = this.fog;

	material.shading = this.shading;

	material.wireframe = this.wireframe;
	material.wireframeLinewidth = this.wireframeLinewidth;
	material.wireframeLinecap = this.wireframeLinecap;
	material.wireframeLinejoin = this.wireframeLinejoin;

	material.vertexColors = this.vertexColors;

	material.skinning = this.skinning;
	material.morphTargets = this.morphTargets;
	material.morphNormals = this.morphNormals;

	return material;	//返回克隆的MeshPhongMaterial物件

};
 

以下程式碼是THREE.JS 原始碼檔案中materials/MeshPhongMaterial.js檔案的註釋.