inflearn logo
강의

Khóa học

Chia sẻ kiến thức

Phát triển web 3D tương tác học bằng React Three Fiber (R3F)

Xử lý bằng cách nhận intersect object từ raycaster

물질을 클릭했을 때 이벤트

Đã giải quyết

402

hoonun7104

4 câu hỏi đã được viết

0

물질에게 클릭이벤트를 주어 보이는 시점이 바뀌거나 물체가 이동할수있게 하고싶습니다.

javascript react typescript 인터랙티브-웹 three.js webgl react-three-fiber

Câu trả lời 1

0

taejaehan

안녕하세요 :흥 님. 질문주셔서 감사합니다.

 

먼저 오브젝트에 클릭이벤트를 주어 물체를 이동하시려면 아래 강의를 참고하시면 따라하실 수 있을 것 같습니다.

섹션 7. Interaction & event / raycaster - r3f interaction event 종류들 및 오브젝트 변경

 

또한 카메라의 시점을 변경하고 싶으시면 아래 강의를 참고하시면 좋을것 같습니다.

섹션 10. [프로젝트] 카메라 컨트롤 - 카메라 부드럽게 이동하기

 

그리고 물체를 한번에 순간 이동하는 것이 아니라 매 프레임마다 천천히 이동하고 싶으시면 아래 강의를 참고하셔서

useFrame안에서 조금씩 포지션을 변경하는 방법을 사용하시면 됩니다.

섹션 2. R3F 설명 - Renderer ( useFrame )

 

잘 안되시면 어떤 부분에서 막히시는지 알려주시면 같이 살펴보겠습니다! 감사합니다 :)

1

hoonun7104

다른 강의에 내용이 있었네요 급한나머지 너무 알고싶어서 그랬네요^^ 제가 shapespark라는 프로그램으로 작업을 하는데 알고 계시는지요??

0

taejaehan

또 답글이 있는지 몰랐네요! 음.. shapespark라는 프로그램은 저도 경험이 없어서 잘 모르겠습니다. 잠깐 찾아보니 3D 모델을 쉽게 업로드하고 테스트해볼 수 있을것 같네요 ㅎ 감사합니다 !

cd 명령어가 안들어요

0

3

1

클로드 데스크앱과의 차이

0

6

1

nmp run build의 기능

0

3

1

plan mode 개발 계획안 확인 불가

0

8

2

명시적 타입 선언(콜론 타입 선언)과 as 타입 단언 차이

0

10

1

max x5 플랜을 결제했습니다.

0

16

1

클로드 초기 설정

0

16

1

사용자 스코프 설정 파일 적용 문제

0

10

1

클로드코드 유료플랜 할인 방법이 있을까요?

0

29

0

제네릭 클래스 핸드북 페이지가 undefined라고 나옵니다.

0

12

1

API Error : 400 에러의 원인과 해결방법이 궁금합니다!!

0

19

2

퍼미션 권한 설정 문의

0

23

2

ai 도구 질문

0

31

1

오브젝트에의 이벤트 감지 vs 레이캐스팅

0

55

2

섹션 10을 들었을때 궁금증

0

87

2

material 파트까지 들은 후 생긴 궁금증

0

150

1

zoom과 fov의 차이점이 잘 이해가 안됩니다.

1

275

2

1강 관련하여 의견을 여쭙고 싶은 게 있습니다.

0

127

1

'JSX.IntrinsicElements' 유형에 'mesh' 속성이 없습니다. 경고 해결법

1

306

2

onClick 이벤트함수로 raycaster 방향이 자동으로 set되나요?

0

176

2

화면에 렌더링은 되는데 코드에서 빨간줄이 떠요

0

382

2

문제 해결했습니다.

0

179

1

문제 있어요! alias Path @ 문제

0

461

2

dom / svg / canvas

0

230

1