three.js : 수동으로 생성 된 지오메트리

처음부터 THREE.Geometry를 만들려고합니다. 내가 (A THREE.Mesh에서) 그것을 사용하려고하면, 내가 지오메트리 생성하고 화면에 표시가됩니다three.js : 수동으로 생성 된 지오메트리

TypeError: faces3 is undefined @ three.js:20426

를 얻을 ~~하지만 실행은~~ 을 중지합니다. 여기

나는 코드를 사용하고 있습니다 :

makePlane = function(width, height) 
{ 
    var geom = new THREE.Geometry(); 

    var v0 = new THREE.Vector3(0, 0, 0); 
    var v1 = new THREE.Vector3(width, 0, 0); 
    var v2 = new THREE.Vector3(width, height, 0); 

    geom.vertices.push(v0); 
    geom.vertices.push(v1); 
    geom.vertices.push(v2); 

    var face = new THREE.Face3(0, 1, 2); 

    geom.faces.push(face); 

    return geom; 
};

다른 내가 그것이 작동되도록하려면 어떻게해야합니까?

업데이트 : R62에서 여전히 발생합니다. 그것은 PlaneGeometry 클래스에 내장 된 three.js에 의해 생성 된 지오메트리에서도 발생하므로 아마도 three.js 버그입니다. 나는 보고서를 제출할 것이다.

실제로 실행이 실제로 이 아니고이 아니라고 언급해야합니다. 이것은 내 실수였습니다. 나는 그저 오류를 얻었을 뿐이며, 아무 잘못이 없다면 어떤 오류라도 가져야한다고 생각하지 않는다.

업데이트 2 : 기록 된 문제가 here이지만 폐쇄되었습니다. 당신은 당신이 기하 객체를 반환하기 전에이 줄을 추가해야 할 수도 있습니다 더 계산 단계에서 무엇에 따라

출처

2013-10-23 tacospice

는 기하 구조가 메쉬로 연결되어 있고 위치와 크기 뷰 절두체 내 –

을 (표시)입니다 또한 경우 바로 확인하려면, 실행 가능한 코드를 게시 할 수 있습니다 @ George 실제로 깨끗한 스크립트에서 오류를 재현 할 수는 없지만 실제로 사용하는 코드는 여기의 처음 몇 줄에 있습니다. https://github.com/tacospice/tacosjs/blob/master/js/engine/ Entity/Plane.js – tacospice

너는 어떤 너비/높이 치수를 보았는가? –

geom.computeCentroids(); 
geom.computeFaceNormals(); 
geom.computeVertexNormals();

출처

2013-10-23 09:34:34 Subimago

geom.computeCentroids(); 사라졌습니다. – cquezel

첫째로, 당신은 세 가지의 최신 버전을 사용하고 있는지 확인하십시오. js 라이브러리.

형상이 작동하려면 몇 가지 사항을 설정해야합니다. 당신은 렌더러, 카메라, 장면이 필요하고 구조.

Geometry에 대한 설명서를 기반으로 나중에 computeCentroids() 및 computeBoundingBox()과 같은 형상을 사용하는 방법을 제공해야합니다.

여기서 값을 반환하지 않아도됩니다. 실제로 개체가 표시되지 않도록합니다. 다음은 코드에 기반한 완전한 기능의 코드입니다. 그냥 three.js를 참조가 정확한지 확인 :

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Custom Geometry</title> 
</head> 
<body> 
    <script src="three.min.js"></script> 
    <script> 

     var container, 
      camera, 
      scene, 
      renderer, 
      geom; 

     init(); 

     function init() { 
      container = document.createElement('div'); 
      document.body.appendChild(container); 

      //renderer 
      renderer = new THREE.CanvasRenderer(); //Use CanvasRenderer with simple geometry 
      renderer.setSize(window.innerWidth, window.innerHeight); 
      //scene 
      scene = new THREE.Scene(); 
      //camera 
      camera = new THREE.PerspectiveCamera(60, window.innerWidth/window.innerHeight, 1, 2000); 
      camera.position.z = 500; 

      //Your custom geometry here 
      makePlane(200, 300); 

      container.appendChild(renderer.domElement); 

      renderer.render(scene, camera); 

     } 

     function makePlane(width, height) { 

      var material = new THREE.MeshBasicMaterial({ color: 0x297bbb }); 
      geom = new THREE.Geometry() 

      geom.vertices.push(new THREE.Vector3(0, 0, 0)); 
      geom.vertices.push(new THREE.Vector3(width, 0, 0)); 
      geom.vertices.push(new THREE.Vector3(width, height, 0)); 

      geom.faces.push(new THREE.Face3(0, 1, 2)); 

      //return geom; //you don't need this 

      geom.computeBoundingSphere(); //<--add what you need here 

      geoMesh = new THREE.Mesh(geom, material); //added custom geometry to a mesh with a material 
      geoMesh.position.y = -50; 

      scene.add(geoMesh); 
     }; 

    </script> 
</body> 
</html>

출처

2013-10-24 01:55:14 MCSharp

생성 된 형상을 반환하지 않으면 어떻게 사용합니까? 나는 다시 정의되지 않을거야. – tacospice

@tacospice 기능 코드로 대답을 업데이트했습니다. 이것이 시작하는 데 도움이 될 것이라고 확신합니다. – MCSharp

three.js : 수동으로 생성 된 지오메트리

답변

관련 문제