Three.js - 多重材質飛機

我試圖在單一平面上製作多個材質來製作簡單的地形編輯器。所以，我創建了幾個材料，並嘗試在我的飛機分配matetrial索引每個頂點：Three.js - 多重材質飛機

var materials = []; 
materials.push(new THREE.MeshFaceMaterial({ color: 0xff0000 })); 
materials.push(new THREE.MeshFaceMaterial({ color: 0x00ff00 })); 
materials.push(new THREE.MeshFaceMaterial({ color: 0x0000ff })); 
// Plane 
var planegeo = new THREE.PlaneGeometry(500, 500, 10, 10); 
planegeo.materials = materials; 
for(var i = 0; i < planegeo.faces.length; i++) 
{ 
    planegeo.faces[i].materialIndex = (i%3); 
} 

planegeo.dynamic = true; 
this.plane = THREE.SceneUtils.createMultiMaterialObject(planegeo, materials);

但我總是要麼一大堆錯誤的着色器，或者只有一個全紅飛機，如果我使用MeshBasicMaterial而不是FaceMaterial。任何幫助是偉大的thx！

來源

2012-09-15 David Menard

http://stackoverflow.com/questions/8820591/how-to -use-multiple-materials-in-a-three-js-cube大致相同的問題 – Gero3

是的，我看到一個，但它是three.js的舊版本，似乎不工作:( –

要得到三種顏色爲棋盤圖案的做到這一點：

// geometry 
var geometry = new THREE.PlaneGeometry(500, 500, 10, 10); 

// materials 
var materials = []; 
materials.push(new THREE.MeshBasicMaterial({ color: 0xff0000 })); 
materials.push(new THREE.MeshBasicMaterial({ color: 0x00ff00 })); 
materials.push(new THREE.MeshBasicMaterial({ color: 0x0000ff })); 

// assign a material to each face (each face is 2 triangles) 
var l = geometry.faces.length/2; 
for(var i = 0; i < l; i ++) { 
    var j = 2 * i; 
    geometry.faces[ j ].materialIndex = i % 3; 
    geometry.faces[ j + 1 ].materialIndex = i % 3; 
} 

// mesh 
mesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials)); 
scene.add(mesh);

編輯：更新了three.js所R.60

來源

2012-09-15 18:12:41 WestLangley

Three.js - 多重材質飛機

回答

相關問題