2014-03-27 2 views
0

Three.JS에서 나는 원점을 기준으로 객체를 회전시킬 수 있습니다. 예를 들어 선으로이 작업을 수행하면 선이 회전하지만 정점의 위치가 새 위치로 업데이트되지 않습니다. 점의 새 위치를 찾기 위해 꼭지점의 위치에 회전 행렬을 적용하는 방법이 있습니까? x가 45도, y가 20도, z가 100 도인 점 (0,0,0)과 점 (0,100,100)으로 선을 회전한다고 가정 해 보겠습니다. 장면과 관련하여 꼭지점의 실제 위치를 찾는 방법은 무엇입니까?Three.JS : 회전 된 객체의 위치 얻기

감사합니다.

답변

3

예, '전체 장면'은 세계 위치를 의미합니다.

THREE.Vector3()는 applyMatrix4() 메소드를 가지고

셰이더는이

yourPoint.applyMatrix4(yourObject.matrixWorld); 
할 것이라고 세계 공간으로 정점을 투영하기 위해 그렇게하는 것과 같은 일을 할 수

카메라 공간으로 당신이 적용 할 수있는 프로젝트이 다음

yourPoint.applyMatrix4(camera.matrixWorld); 

-1의 실제 화면 위치를 얻는 1

yourPoint.applyMatrix4(camera.projectionMatrix); 

하기이

var yourPoint = yourObject.geometry.vertices[0]; //first vertex 

처럼 지점에 액세스 할 오히려이 세 번하는 것보다, 당신은 단지 행렬을 결합 할 수 있습니다. didnt는 이것을 시험한다. 그러나 이것의 선을 따라 무엇인가. 다른 방법으로 갈 수도 :이 후드 아래에 무엇에 좋은 튜토리얼이 필요하면 내가 this

Alteredq이 three.js를 행렬에 대해 알아야 할 모든 것을 게시하는 것이 좋습니다

var neededPVMmatrix = new THREE.Matrix4().multiplyMatrices(yourObject.matrixWorld, camera.matrixWorld); 
neededPVMmatrix.multiplyMatrices(neededPVMmatrix, camera.projectionMatrix); 

here

편집

참고로 한 가지주의 할 점은 회전이 아니라 번역이 필요하면 상단 3x3 부분을 사용해야한다는 것입니다. 모델 행렬의 수열 행렬. 이것은 약간 더 복잡 할 수 있습니다. three.js가 제공하는 것을 잊어 버렸지 만, normalMatrix가 트릭을 수행하거나 THREE.Vector3()을 THREE.Vector4()로 변환하고 .w를 0으로 설정하면 변환이 수행되지 않습니다. 적용됩니다. EDIT2

당신이 당신의 예에서 라인 지점을 이동하려는 경우

대신 입자에 적용하는,

var yourVertexWorldPosition = new THREE.Vector3().clone(geo.vertices[1]); //this is your second line point, to whatever you set it in your init function 
yourVertexWorldPosition.applyMatrix4();//this transforms the new vector into world space based on the matrix you provide (line.matrixWorld) 
+0

감사에 적용, 나는 이것을 시도 할 것이다. – mjkaufer

+0

dev.kaufer.org/angle에 내 코드가 있습니다. 콘솔에서'applyRotation (0, Math.PI/4, 0)'을 호출하면 y가 45도 회전합니다. 점은 움직이지 않습니다. 그러나'applyRotation (0, Math.PI/2, 0)'을 다시 호출하면 파티클은 원래 있었던 위치로 이동합니다. 'applyRotation'을 실행하여 코드를 볼 수 있습니다. – mjkaufer

+0

제 편집을보세요. 실제 꼭지점에 이것을 적용해야합니다. – pailhead