inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

Three.js로 시작하는 3D 인터랙티브 웹

three.js 사용 방법 1

three.js 사용방법 1

948

jinseong kwak

작성한 질문수 1

0

아무것도 뜨지 않습니다 왜그럴까요?

blender 인터랙티브-웹 three.js

답변 3

0

1분코딩

mana님 말씀대로, 01_normal 폴더를 프로젝트 폴더로 세팅하시고(01_normal 폴더를 VSCode에 드래그앤 드롭 하거나 open하시면 돼요), 라이브서버를 구동해 보세요. 스샷을 보니 루트 폴더가 잘못된 것으로 보입니다!

0

management

normal 폴더를 루트로 두고 vscode 실행 후 라이브 서버 켜보세요
https://github.com/ritwickdey/vscode-live-server/blob/master/docs/settings.md

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴이에요.

three.js를 사용하면서 아무것도 화면에 뜨지 않는 현상이 발생했다고 하셨는데요, 이는 여러 가지 원인이 있을 수 있습니다. 몇 가지 확인해볼 점을 안내해드릴게요.

  1. 렌더러 생성 및 크기 설정: three.js에서는 우선적으로 렌더러를 생성하고 화면에 보여줄 크기를 설정해야 합니다. CanvasRenderer, WebGLRenderer 등 여러 가지 렌더러 중 어떤 것을 사용하는지 확인하고, 렌더러 생성과 크기 설정 코드를 추가해보세요.

  2. 카메라 설정: three.js에서는 활성화된 카메라가 없으면 화면이 보이지 않을 수 있습니다. 카메라를 생성하고, 위치와 방향을 설정해보세요. 필요한 경우 perspective나 orthographic 등 다양한 종류의 카메라를 사용할 수 있습니다.

  3. 조명 설정: three.js에서는 조명을 사용하여 물체가 어두운지 밝은지를 결정합니다. 조명을 생성하고 물체에 적절한 조명을 추가해보세요. AmbientLight, DirectionalLight, PointLight 등 다양한 종류의 조명을 사용할 수 있습니다.

  4. 재질 설정: 물체에는 재질을 설정해줘야 화면에 렌더링됩니다. 물체에 적절한 재질을 설정해보세요. MeshBasicMaterial, MeshPhongMaterial, MeshLambertMaterial 등 다양한 종류의 재질이 있습니다.

위의 사항들을 확인해보시고 제대로 설정되었는지 확인해보세요. 그래도 문제가 해결되지 않는다면, 코드를 좀 더 자세히 살펴봐야 할 것 같습니다. 혹시 코드나 에러 메시지를 함께 공유해주시면 더 정확한 도움을 드릴 수 있을 것 같아요.

box3.position.x 위치

0

38

1

리액트/next.js와 같이 사용하는 강의 계획은 없으신가요?

0

80

1

소스코드 파일이 강의랑 같나요?

0

118

2

materials 배열에 있는 top, bottom ... 들에 대해서

0

118

0

gltf 포맷 사용

0

243

1

점프 애니메이션 stop

0

127

2

사양에 따른 다른 결과

0

112

1

중복 질문 삭제

0

160

1

혹시 이 빛의 범위를 조절할 수 있는 방법이 있나요?

0

124

1

gltf.scene.children 이 없는데도 모델이 화면에 떠요

0

101

2

GLF파일 export한 후에 three.js에서 렌더링 된 모델에는 텍스처 적용이 안되어있습니다..!

0

160

1

일반 유리, 강화 유리 강의에서 Glass 객체의 position X를 -1, 1로 설정한 이유를 모르겠어요

0

77

0

그림자가 다르게 표현됩니다

0

138

1

setAnimationLoop 위치가...

0

99

1

얼굴 그릴 때 붓이 깔끔하게 칠해지지 않고 얼룩덜룩해요

0

135

1

블렌더 texture paint 시 미러모드

0

163

0

DragControls의 인자값을 바꾸지 않았는데 에러가 안떠요!

0

104

1

blender 에서 색칠하기 편 Texter paint slot추가없음

0

966

2

fin 버전도 그냥 실행이 안돼요

0

289

2

자바스크립트 실행이 안되는 것 같아요

0

379

1

모니터 해상도에 따라 mesh의 크기가 변할 수 있나요?

0

238

1

live server와 localhost:8080

0

345

1

material에 canvas 를 texture 로 넣는방법이 궁금해요

0

270

1

모바일 조이스틱은 어떻게 만들 수 있을까요?

0

208

1