在 Forge Viewer 裏展現/隱藏構件材質

這篇文章來自 Autodesk ADN 的梁曉冬,如下以我簡稱。html

對於大多數的模型文檔均可以透過 Autodesk Forge Model Derivative 服務提取、轉換在 Viewer 裏渲染(Render)構件外觀時所需的材質(Material)及貼圖(Texture)。在 Viewer 裏渲染這些材質是會耗損計算機內存(Memory)的,但有時候咱們觀注的是構件的幾何信息,貼圖(Texture)反卻是能夠被忽略的,但這要怎麼作到呢?瀏覽器

在 Viewer API 裏有一個函數matman()能夠獲取 Viewer 的材質管理員,透過它能夠取得全部 Viewer 自帶和自訂的材質。因此咱們能夠透過它遍歷全部材質,找出咱們想隱藏貼圖的那些材質,將它的顏色設置爲灰色,同時也能夠透過它將隱藏貼圖的材質回覆。ide

注:這個例子沒辦法在沒貼圖的材質上有做用;這範例在瀏覽器 Console 測試過,且使用默認的 Viewer 實例 NOP_VIEWER。函數

//store textures data
var oldTextures = new Array();
//store color data
var oldColors = new Array();

//remove texture
function hideTexture() {

    //get materials list
    var mats = NOP_VIEWER.impl.matman()._materials;

    //define a grey color
    var grey = new THREE.Color(0.5, 0.5, 0.5);

    //iterate materials 
    for (index in mats) {

        //index is the material name (unique string in the list)
        m = mats[index];

        //store texture info
        oldTextures[index] = m.map;
        oldColors[index] = m.color;

        //set the material without texture and the grey color
        m.map = null;
        m.color = grey;

        //mark the material dirty. The viewer will refresh
        m.needsUpdate = true; 
    }

    //refresh the scene
    NOP_VIEWER.impl.invalidate(true, true, false);
}

//show texture
function showTexture()
{
    //get materials list
    var mats = NOP_VIEWER.impl.matman()._materials;

    //iterate materials 
    for (index in mats) {

        //index is the material name (unique string in the list)

        m = mats[index];
 
       //restore
        m.map = oldTextures[index];
        m.color = oldColors[index];;
        m.needsUpdate = true; 
    }

    //refresh the scene

    NOP_VIEWER.impl.invalidate(true, true, false);

}

在隱藏貼圖前的樣子:
圖片描述測試

在移除貼圖後的樣子:
圖片描述spa

上述的例子我沒有在 Shader Material 上測試,或許有更有的辦法可行,我建議各位朋友們能夠參考我同事發佈的其餘博客:rest

  1. Using Shaders to Generate Dynamic Textures in the Viewer API
  2. Ace Editor for Three.js ShaderMaterials in the Forge Viewer
  3. Forge Viewer Custom Shaders - Part 1
  4. Forge Viewer Custom Shaders - Part 2
相關文章
相關標籤/搜索