three.jsを使用してxz平面に線を描く方法

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