Как нарисовать линии в плоскости xz, используя three.js

Question

Я хочу нарисовать серию параллельных линий в плоскости xz, но не могу найти достаточно простой пример.

Я подозреваю, что использование геометрии каким-то образом ошибочно.

function initGrid(){ 
    var material = new THREE.LineBasicMaterial({ color: 0x00ff00 }); 
    var geometry = new THREE.Geometry(); 
    for(var i=0 ; i<10; i++){ 
    geometry.vertices.push(
     (10*i,0,0), (10*i,0,100) 
    ); 
    } 
    var grid = new THREE.LineSegments(geometry, material); 
    scene.add(grid); 
} 

Мое мышление является то, что геометрический объект отдается LineSegments должен состоять из пар координат, представляя начинают & конечные точки каждой линии. Однако вышеуказанная функция не работает.

Может ли кто-нибудь дать правильную технику?

Answer 1

Вершины Geometry представляют собой массив THREE.Vector3.

geometry.vertices.push(new THREE.Vector3(x, y, z)); 

Также вы можете использовать THREE.GridHelper(size, divisions, color1, color2).

three.js r.84