使用小工具 > 3D > 模型 (Model) > 顯影程式
顯影程式
* 
HoloLens 裝置不支援這些顯影程式。
參數輸入項
您可以使用下列格式將自訂顯影程式值傳遞至 Vuforia Studio 顯影程式：
example_widget.shader = shader_name; uniform_name uniform_type uniform_value
顯影程式
下表說明了 Vuforia Studio 中模型與模型項目可用的基本顯影程式。
顯影程式
描述
參數
不飽和
用以緩解模型色彩飽和度的顯影程式。
saturation float [0-1]
JavaScript 範例：
$scope.init = function() {
  // Desaturate shader:
  //   * saturation (float [0-1])
  let desaturateModel = $scope.view.wdg['desaturate-model'];
  desaturateModel.shader = 'desaturate; saturation f 0.0 ';
};
angular.element(window.document.body).ready($scope.init);
以下範例的模型完全使用 saturation=0 著色，因此以灰階顯示。
流程
以 UV 座標動畫使用紋理貼圖來標示方向的顯影程式。
• speedU- 材質座標的水平速度 (每秒一個材質單位)
• speedV- 材質座標的垂直速度 (每秒一個材質單位)
• scaleU- 水平縮放 (在動畫中彩現圖像的重複次數)
• scaleV- 垂直縮放 (在動畫中彩現圖像的重複次數)
• opacity- 掌控不透明度 (0.0 = 完全透明，1.0 = 完全不透明)
* 
如果重設流程顯影程式，已套用顯影程式之模型和模型項目的材質會遭到移除。
JavaScript 範例：
$scope.init = function() {
let flowImage = $scope.view.wdg['flow-image'];
flowImage.shader = 'flow; speedU f 0.3; speedV f 0.0; scaleU f 1.0; scaleV f 1.0; opacity f 1.0';
flowImage.src = 'app/resources/Uploaded/flow_texture.png?edge=repeat';
};
angular.element(window.document.body).ready($scope.init);
醒目提示
用以顯目提示整個模型或特定零件的顯影程式。
下列參數定義了輪廓與曲面填充的顏色：
• r float [0-1]
• g float [0-1]
• b float [0-1]
• a float [0-1]- 定義曲面填充的不透明度。輪廓將始終保持不透明。
• virtualMode- 設定為 true 時，顯影程式會運用標準的深度測試模式以標準實體彩現虛擬曲面。如果存在實體物件，此參數將設為 false。
JavaScript 範例：
$scope.init = function() {
let highlightModelItem = $scope.view.wdg['highlight-modelitem'];
highlightModelItem.shader = 'highlight; r f 1.0; g f 0.49; b f 0.15; a f 1.0; virtualMode f 1.0';
};
angular.element(window.document.body).ready($scope.init);
在以下範例中，藍色幫浦的下半部已使用橘色醒目提示。
平面切削
用於以直線或平面切除模型幾何圖案的顯影程式。
下列參數定義了剖面平面的位置：
• clipCenterX float
• clipCenterY float
• clipCenterZ float
下列參數定義了剖面平面的定向：
• clipAxisX float
• clipAxisY float
• clipAxisZ float
下列參數以空間單位 (公尺) 定義了模型遮障邊的厚度。
• clipLineWidth float
* 
如果不想套用此參數，請將其設定為 0。
JavaScript 範例：

$scope.init = function() {
  let planarCutModel = $scope.view.wdg['planar-cut-model'];
  planarCutModel.shader = 'planar_cut; clipCenterX f 0.0; clipCenterY f 0.26; clipCenterZ f 0.0; clipAxisX f 0.0; clipAxisY f -1.0; clipAxisZ f 0.0; clipLineWidth f 0.003';
};
angular.element(window.document.body).ready($scope.init);
球狀切削
用於以球面切除模型幾何圖案的顯影程式。
• clipCenterX float
• clipCenterY float
• clipCenterZ float
• clipRadius float (以公尺為單位)
JavaScript 範例：
$scope.init = function() {
  let sphericalCutModel = $scope.view.wdg['spherical-cut-model'];
  sphericalCutModel.shader = 'spherical_cut; clipCenterX f 0.05; clipCenterY f 0.05; clipCenterZ f 0.05; clipRadius f 0.4';
};
angular.element(window.document.body).ready($scope.init);
* 
球狀切削顯影程式僅適用於同時具有內部幾何的詳細模型；否則，背面剔除可能會導致結果不盡理想。
X 光
用以顯示模型的 X 光檢視和揭示內部零件的顯影程式。
• r float [0-1]
• g float [0-1]
• b float [0-1]
• a float [0-1]
JavaScript 範例：
$scope.init = function() {
  let xrayModel = $scope.view.wdg['xray-model'];
  xrayModel.shader = 'xray; r f 0.882; g f 0; b f 1; a f 0.5';
};
angular.element(window.document.body).ready($scope.init);
套用顏色以重新著色模型，同時套用顯影程式，進一步顯目提示套用顯影程式的位置。
輪廓
根據深度梯度擷取輪廓線的顯影程式。
* 
由於此顯影程式目前仍處於測試階段，此顯影程式不應與其他顯影程式同時使用。即使依照順序套用不同的顯影程式，仍可能導致意外結果。
• lineR float [0-1]
• lineG float [0-1]
• lineB float [0-1]
• lineA float [0-1]
JavaScript 範例：
$scope.init = function() {
  let contourModel = $scope.view.wdg['model-1'];
  contourModel.shader = 'contour; lineR f 1.0; lineG f 0.0; lineB f 0.0; lineA f 1.0';
  
};
angular.element(window.document.body).ready($scope.init);
波徑向
可以顯示圓形或波紋效果的顯影程式。
• offsetU/V- 波圈的原點
• surface(R/G/B/A) - 原點的波浪顏色
• waveLength- 兩個連續波峰之間的距離
• speed- 波前的傳播速度 （以標準單位表示）
JavaScript 範例：
scope.init = function() {
  let waveImage = $scope.view.wdg['wave-image'];
  waveImage.shader = 'wave_radial; speed f 20.0; waveLength f 0.03; offsetU f -0.5; offsetV f -0.5; sourceR f 1.0; sourceG f 0.0; sourceB f 1.0; sourceA f 1.0';
};
angular.element(window.document.body).ready($scope.init);
這是否有幫助?