創建使用three.js所

Question

我想知道是否有可能創建一個使用3D three.js所垂直的牆壁，因爲這形象

我試圖用THREE.Shape繪製一個矩形，但我不」 3D垂直牆不知道如何添加更多垂直或平行的矩形。

Answer 1

簡單地構建不同的網OBJ並將它們放置你想要的方式，這將是一個例子

var geometryLateral = new THREE.BoxGeometry(0.2, 2, 5); 
var wall1 = new THREE.Mesh(geometryLateral, material); 
scene.add(wall1); 
wall1.position.x=-1; 
var wall2 = new THREE.Mesh(geometryLateral, material); 
scene.add(wall2); 
wall2.position.x=1; 

兩個壁在這裏彼此面對。

Answer 2

將每個牆的頂角存儲爲順時針或逆時針旋轉的三維頂點的「環」。 （如果您喜歡非平面屋頂，或者只是將它們全部設置爲相同高度，則每個屋頂頂點可以具有不同的z值。）

每個牆都是列表中隨後的一對頂點。

對於每個牆，繪製一個簡單的平面幾何圖形和網格。手動爲平面創建兩個面很容易，而不是混淆其他幾何類型。

//Simple A-frame roof 
var roofVertices = [ 
    new THREE.Vector3(0, 10, 0), new THREE.Vector3(10, 15, 0), new THREE.Vector3(20, 10, 0), 
    new THREE.Vector3(20, 10, 20), new THREE.Vector3(10, 15, 20), new THREE.Vector3(0, 10, 20) 
]; 

var material = new THREE.MeshBasicMaterial({ 
    color: 0xccffcc, 
    side: THREE.DoubleSide 
}); 

for (var i = 0; i < roofVertices.length; i++) { 

    var v1 = roofVertices[i]; 
    var v2 = roofVertices[(i+1)%roofVertices.length];//wrap last vertex back to start 

    var wallGeometry = new THREE.Geometry(); 

    wallGeometry.vertices = [ 
     v1, 
     v2, 
     new THREE.Vector3(v1.x, 0, v1.z), 
     new THREE.Vector3(v2.x, 0, v2.z) 
    ]; 

    //always the same for simple 2-triangle plane 
    wallGeometry.faces = [new THREE.Face3(0, 1, 2), new THREE.Face3(1, 2, 3)]; 

    wallGeometry.computeFaceNormals(); 
    wallGeometry.computeVertexNormals(); 

    var wallMesh = new THREE.Mesh(wallGeometry, material); 
    scene.add(wallMesh); 
}