티스토리 뷰

Three.js

transform 변환- 위치이동

이채야채 2022. 9. 19. 17:56
	function draw() {
        const delta = clock.getDelta();
        
        mesh.position.set(-1,2,-3);

		renderer.render(scene, camera);
		renderer.setAnimationLoop(draw);
	}

draw함수내에서 mesh의 position을 설정해서 보여준다.

이때 position에 대해서 좀 더 자세히 알아봐야한다. 

---> Vector3 란 무엇인가?

 

3차원공간에서 어떤 점의 위치를 나타내는 객체 

x, y, z 값을 가지고있다.

 

원점으로부터의 거리를 얘기한다. 

 

 

1. mesh.position.length()

원점으로부터 거리

 mesh.position.set(-1, 0, 0);
        
        console.log(mesh.position.length());

 

2.mesh.position.distanceTo()

 mesh.position.set(-1, 0, 0);
        console.log(mesh.position.distanceTo(new THREE.Vector3(1,2,0)));

새로운 vector까지의 거리를 나타낸다.

 

THREE.Vector3 대신에  camera.position 같은걸 넣어보면

카메라까지의 거리를 알 수 있다.

 

 

'Three.js' 카테고리의 다른 글

기초 틀 예시  (0) 2022.09.21
transform 변환- 크기 조정 / 회전  (0) 2022.09.20
애니메이션  (0) 2022.09.19
three.js 기본요소 익히기 - 기본장면만들기  (0) 2022.05.27
three.js(모듈로 사용, 웹팩으로 사용)  (0) 2022.05.26
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2025/09   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30
글 보관함