Three.js鏡像正常地圖翻轉頻道

我在Three.js中添加了一個法線貼圖，鏡像在中間。它看起來像其中一個通道（綠色也許？）在鏡像側翻轉。Three.js鏡像正常地圖翻轉頻道

enter image description here

我有一種環境光，一個定向頭燈和一個聚光燈。下面是我使用，使物料代碼：

// Create a MeshPhongMaterial for the model 
var material = new THREE.MeshPhongMaterial(); 
material.map = THREE.ImageUtils.loadTexture(texture_color); 
// Wrapping modes 
//THREE.RepeatWrapping = 1000; 
//THREE.ClampToEdgeWrapping = 1001; 
//THREE.MirroredRepeatWrapping = 1002; 
material.map.wrapS = THREE.RepeatWrapping; 
material.map.wrapT = THREE.MirroredRepeatWrapping; 
if (texture_normal != null) { 
    material.normalMap = THREE.ImageUtils.loadTexture(texture_normal); 
    material.normalMap.wrapS = THREE.RepeatWrapping; 
    material.normalMap.wrapT = THREE.MirroredRepeatWrapping; 
} 
material.wrapAround = true; 
material.morphTargets = true; 
material.shininess = 15; 
material.specular = new THREE.Color(0.1, 0.1, 0.1); 
material.ambient = new THREE.Color(0, 0, 0); 
material.alphaTest = 0.5; 
var mesh = new THREE.MorphAnimMesh(geometry, material); 
// Turn on shadows 
mesh.castShadow = true; 

if (shadows) { 
    mesh.receiveShadow = true; 
} 

scene.add(mesh);

我嘗試了所有的material.normalMap.wrapS和material.normalMap.wrapT的不同組合，但沒有解決它（試圖漫反射貼圖太）。我究竟做錯了什麼？

謝謝！

來源

2014-06-13 tranek

原來我用的攪拌機three.js所出口的舊版本（1.2）。通過從r67存儲庫切換到導出器的最新版本（0123）， ~~Three.js現在可以正確處理帶有Phong着色器的鏡像法線貼圖。~~

編輯：Phong Shader仍然有翻轉頻道的問題。我最終使用了「Normal Map Shader」（請參閱Three.js示例），這給了我正確的結果。不幸的是，Normal Map Shader不適用於Morph動畫，只能用於Skeletal。

來源

2014-07-01 05:00:10 tranek

你可以提供一個簡單的例子，其中'Phong'着色器不滿足您的需求，但'NormalMap'着色器可以接受嗎？ three.js網站可能是最適合發佈的地方。 – WestLangley

你的意思是three.js github網站？如果是這樣，你是否希望我開一個新的問題，或者把它添加到我最近關閉的那個（並重新打開它）？ – tranek

我會建議一個鏈接到一個_simple_現場示例。你可以將它發佈到任何你想要的地方。 – WestLangley

法線貼圖依賴於幾何圖形，所以您不能只是鏡像它，並期望它像散射紋理那樣工作。

要使其正常工作，需要在模型上鏡像UVW的任何位置翻轉法線貼圖的紅色通道。

http://www.polycount.com/forum/showthread.php?t=116922

來源

2014-06-13 15:14:43 thykka

紅色通道！我很接近。這聽起來像問題沒問題。任何想法如何在Three.js中做到這一點？這似乎是一個常見的問題，應該有專門的功能來解決它。 – tranek

Three.js鏡像正常地圖翻轉頻道

回答

相關問題