0

.obj ファイルからメッシュを作成しようとしています。さまざまなスライダーを使用して形状を変形し、特定の面/頂点を選択し、頂点間のパスを描画する必要があるため、obj ローダーを使用するのではなく、これを行っています。

現在、シーンをレンダリングしようとするとエラーが発生します。これは、obj ファイルの顔に関係しているようです。面を手動で入力すると、問題なく三角形を作成できます。

これが私のコードです

   var camera, scene, renderer,
    geometry, material, mesh;

init();
animate();

function init() {

    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/img/originalMeanModel.obj', false);
    xhr.send(null);
    var text = xhr.responseText;
    var lines = text.split("\n");
    for (i=0; i<19343; i++){
      lines[i] = lines[i].split(" ");
    }

    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera( 1, window.innerWidth / window.innerHeight, 1, 2000 );
    camera.position.z = 20;
    scene.add( camera );

    var geometry = new THREE.Geometry()

  /* 
    geometry.vertices.push( new THREE.Vector3( -0.01,  0.01, 0 ) );
    geometry.vertices.push( new THREE.Vector3( -0.01, -0.01, 0 ) );
    geometry.vertices.push( new THREE.Vector3(  0.01, -0.01, 0 ) );
  */
    geometry.faces.push( new THREE.Face3( 0, 1, 2 ) );



    for(i=0; i<6449; i++){
      geometry.vertices.push( 
             new THREE.Vector3( 
              parseFloat(lines[i][1]),   
              parseFloat(lines[i][2]), 
              parseFloat(lines[i][3])) );
    }

    /*
    geometry.faces.push( new THREE.Face3( 0, 1, 2 ) );
    geometry.faces.push( new THREE.Face3( 600, 1, 3000 ) );
    geometry.faces.push( new THREE.Face3( 3000, 6400, 70 ) );
    */


    for(i=6449; i<19343; i++){
      geometry.faces.push( new THREE.Face3( parseInt(lines[i][1]), parseInt(lines[i][2]), parseInt(lines[i][3]) ) );
    }

    console.log(geometry.faces);
    console.log(geometry.vertices);


    material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: false } );
    mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );

    renderer = new THREE.CanvasRenderer();
    renderer.setSize( window.innerWidth, window.innerHeight );

    document.body.appendChild( renderer.domElement );
}

function animate() {
    // note: three.js includes requestAnimationFrame shim
    requestAnimationFrame( animate );
    render();
}

function render() {
    renderer.render( scene, camera );
}

コンソールを調べると、面と頂点が期待どおりに出力されています。このエラーは5700回以上出力されています

Uncaught TypeError: Cannot read property 'visible' of undefined       Three.js:71
projectScene                                                          Three.js:71
render                                                               Three.js:245
render                                                          threeDemo.php:115
animate                                                         threeDemo.php:106

threeDemo.php:106 は animate 関数のこの行です

render();

threeDemo.php:115 は、レンダリング関数のこの行です

renderer.render( scene, camera );

これは、メッシュを作成しようとしている obj ファイルへのリンクです。https://dl.dropbox.com/u/23384412/originalMeanModel.obj

誰かが私を正しい方向に向けることができますか?それは本当にありがたいです.

前もって感謝します。

4

1 に答える 1

1

OBJLoaders各フレームジオメトリのロードに2つ使用できます。次に、3番目Geometryを作成し、フレームジオメトリの頂点を参照として使用して線を作成します。

于 2012-06-26T14:33:05.567 に答える