three.js 源碼注釋（四十六）Material /LineBasicMaterial.js

標籤：webgl   javascript   three.js   源碼   三維   

商域無疆 (http://blog.csdn.net/omni360/)

本文遵循“署名-非商業用途-保持一致”創作公用協議

轉載請保留此句：商域無疆 -  本部落格專註於 敏捷開發及移動和物聯裝置研究：資料視覺效果、GOLANG、Html5、WEBGL、THREE.JS，否則，出自本部落格的文章拒絕轉載或再轉載，謝謝合作。

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

以下代碼是THREE.JS 源碼檔案中Material/LineBasicMaterial.js檔案的注釋.

更多更新在 : https://github.com/omni360/three.js.sourcecode

/** * @author mrdoob / http://mrdoob.com/ * @author alteredq / http://alteredqualia.com/ * * parameters = { *  color: <hex>, *  opacity: <float>, * *  blending: THREE.NormalBlending, *  depthTest: <bool>, *  depthWrite: <bool>, * *  linewidth: <float>, *  linecap: "round", *  linejoin: "round", * *  vertexColors: <bool> * *  fog: <bool> * } *//*///LineBasicMaterial方法根據參數parameters建立線段的虛線線型材質,parameters參數的格式看上面.LineBasicMaterial對象的功能函數採用/// 定義構造的函數原型對象來實現.大部分屬性方法繼承自材質的基類Material.用材質來定義線性,第一次見,真的很有想象力.簡直就是對繪圖軟體的終結.*////<summary>LineBasicMaterial</summary>///<param name ="parameters" type="String">string類型的JSON格式材質屬性參數</param>///<returns type="LineBasicMaterial">返回LineBasicMaterial,虛線線段材質.</returns>THREE.LineBasicMaterial = function ( parameters ) {THREE.Material.call( this );//調用Material對象的call方法,將原本屬於Material的方法交給當前對象LineBasicMaterial來使用.this.color = new THREE.Color( 0xffffff );//顏色屬性/*******************************************linecap和linejoin屬性詳解****************************************lineCap 屬性指定線段如何結束。只有繪製較寬線段時，它才有效。這個屬性的合法值如下表所示。預設值是："round"。值含義"butt"這個預設值指定了線段應該沒有線帽。線條的末點是平直的而且和線條的方向正交，這條線段在其端點之外沒有擴充。"round"這個值指定了線段應該帶有一個半圓形的線帽，半圓的直徑等於線段的寬度，並且線段在端點之外擴充了線段寬度的一半。"square"這個值表示線段應該帶有一個矩形線帽。這個值和 "butt" 一樣，但是線段擴充了自己的寬度的一半。lineJoin 屬性設定或返回所建立邊角的類型，當兩條線交匯時。注釋：值 "miter" 受 miterLimit 屬性的影響。預設值：round值描述bevel建立斜角。round建立圓角。miter預設。建立尖角。********************************************linecap和linejoin屬性詳解****************************************/this.linewidth = 1;//線寬屬性,預設初始化為1.this.linecap = 'round';//線段端點的樣式,預設為round,和html的canvas裡的屬性一樣也有"butt", "round", "square"this.linejoin = 'round';//線段邊角的類型，當兩條線交匯時,預設為round,和html的canvas裡的屬性一樣也有"round", "bevel", "miter"this.vertexColors = THREE.NoColors;//頂點顏色,預設初始化為false.當然還可以有THREE.NoColors / THREE.VertexColors / THREE.FaceColors等選項,這裡顯示出了javascript的靈活性了.this.fog = true;//霧效,預設初始化為true.//TODO: LineDashedMaterial為啥有霧效屬性,而且為啥預設初始化為true?????????this.setValues( parameters );//調用Material類的setValues方法,將參數parameters賦值給當前LineBasicMaterial材質的屬性.};/*****************************************************************下面是LineBasicMaterial對象的方法屬性定義,繼承自Material*************************************************************/THREE.LineBasicMaterial.prototype = Object.create( THREE.Material.prototype );/*clone方法///clone方法複製LineDashedMaterial對象,*////<summary>clone</summary>///<param name ="material" type="LineBasicMaterial">LineBasicMaterial對象,可有可無.</param>///<returns type="LineBasicMaterial">返回複製的LineBasicMaterial對象</returns>THREE.LineBasicMaterial.prototype.clone = function () {//以下是將材質的屬性一一進行複製.var material = new THREE.LineBasicMaterial();THREE.Material.prototype.clone.call( this, material );material.color.copy( this.color );material.linewidth = this.linewidth;material.linecap = this.linecap;material.linejoin = this.linejoin;material.vertexColors = this.vertexColors;material.fog = this.fog;return material;//返回複製的LineBasicMaterial對象};

商域無疆 (http://blog.csdn.net/omni360/)

本文遵循“署名-非商業用途-保持一致”創作公用協議

轉載請保留此句：商域無疆 -  本部落格專註於 敏捷開發及移動和物聯裝置研究：資料視覺效果、GOLANG、Html5、WEBGL、THREE.JS，否則，出自本部落格的文章拒絕轉載或再轉載，謝謝合作。

以下代碼是THREE.JS 源碼檔案中Material/LineBasicMaterial.js檔案的注釋.

更多更新在 : https://github.com/omni360/three.js.sourcecode

three.js 源碼注釋（四十六）Material /LineBasicMaterial.js