如何获得自定义网格的自定义材料

Question

我想画一座房子。 我是three.js的新手 我知道如何画立方体（墙） 但是如何最好地绘制屋顶？尤其是屋顶正下方的那段墙？ 我知道这样一种方法：

var starPoints = [];

starPoints.push(new THREE.Vector2(-500, 0));
starPoints.push(new THREE.Vector2(0, 500));
starPoints.push(new THREE.Vector2(500, 0));

var starShape = new THREE.Shape(starPoints);

var extrusionSettings = {
    size: 0, height: 0, curveSegments: 0,
    bevelThickness: 0, bevelSize: 0, bevelEnabled: false,
    material: 0
    , extrudeMaterial: 1
    , amount: 100
};

var starGeometry = new THREE.ExtrudeGeometry(starShape, extrusionSettings);

var materialFront = get_material(gparams.kirpich, 1, 1); //materials_list.basic_color; // new THREE.MeshBasicMaterial({ color: 0xffff00 });
var materialSide = get_material(gparams.kirpich, 1, 1);
var materialSide2 = new THREE.MeshBasicMaterial({ color: "#f00" });
var materialArray = [materialFront, materialSide];
var starMaterial = new THREE.MeshFaceMaterial(materialArray);


var star = new THREE.Mesh(starGeometry, materialFront);
star.position.set(0, 250, 0);
//star.rotation.x = -90 * Math.PI / 180;

scene.add(star);

我有一个三角形，但我无法获得这个三角形的必要材料。 我只能获取颜色材料，但我想从材料图片中获取自定义材料。 我怎样才能获得必要的材料，或者可能有另一种方法来获得用于这些目的的自定义材料的自定义网格？

非常感谢您！

Answer 1

听起来您想使用loadTexture，您可以使用它来将图像加载到网格上。

texture = THREE.ImageUtils.loadTexture(<your image>);
material = new THREE.MeshBasicMaterial({map: texture});

查看一些示例 here、here、here 和 here。

更新（见 cmets）

要更改纹理，请保留网格的副本，然后更改纹理并将纹理上的 needsUpdate 设置为 true。最后，在材质贴图上设置纹理。请参阅here 和以下代码：

 function setTextureImage( imageSrc )
 {         
     texture = THREE.ImageUtils.loadTexture(<your imageSrc>);
     texture.needsUpdate = true;
     m_modelMesh.material.map = texture;         
 }