• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

lookAt(mesh.position) 관련 질문입니다!

23.07.08 21:18 작성 23.07.08 21:24 수정 조회수 242

0

GUI컨트롤 강의에서 8:05에 lookAt(mesh.position)을 했는데 왜 lookAt(mesh)를 하면 화면에 아무것도 안 보이는건가요??

+애니메이션이 계속 업데이트 되기 때문에 camera.lookAt(mesh.position)을 draw()함수에 넣어야된다고 하셔서 애니메이션을 끄고 실행해보려고 draw()함수를 주석처리하고 camera.lookAt(mesh.position)을 다음과 같이 넣었더니 GUI를 움직여도 변화가 없는데 이건 왜인가요??ㅠㅠ

 

// GUI
const gui = new dat.GUI();
gui.add(mesh.position, 'y', -5, 5, 0.01).name('y 위치'); //조정할 속성, 속성값, 최솟값, 최댓값, 조정 단위 
gui
    .add(mesh.position, 'z')
    .min(-10)
    .max(3)
    .step(0.01) //위와 같은데 쓰는 방식만 다른거임
    .name('메쉬의 z위치'); //조정 이름 설정

gui.add(camera.position, 'x', -10, 10, 0.01).name('카메라 x');
camera.lookAt(mesh.position);
// 그리기
const clock = new THREE.Clock();

// function draw() {
    
// 	const time = clock.getElapsedTime();

// 	mesh.rotation.y = time;

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

답변 2

·

답변을 작성해보세요.

0

ODeorain님 말씀대로, 계속 변경된 화면을 그려줘야하기 때문에 camera.lookAt을 계속 반복 실행되는 함수인 draw에 넣어주셔야 합니다~ draw 함수를 예제대로 아래처럼 작성해 보세요^^

function draw() {
		const time = clock.getElapsedTime();
		mesh.rotation.y = time;

		camera.lookAt(mesh.position);

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

 

0

ODeorain님의 프로필

ODeorain

2023.07.10

애니메이션이 계속 업데이트 되어야 변경된 GUI값을 화면에 반영할 수 있기 때문이 아닐까요...?

function draw(){

renderer.render(scene,camera);
renderer.setAnimationLoop(draw);
camera.lookAt(mesh.position);

}