묻고 답해요
130만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
모바일 조이스틱은 어떻게 만들 수 있을까요?
studiomeal.com 을 모바일로 들어가면 조이스틱이 있는데 혹시 이런 조이스틱을 찾을 수 있는 키워드 없을까요?
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
징검다리 예제에서 SpotLight가 동작 오류
징검다리 예제에서 SpotLight가 동작하지 않는 것 같습니다.강의 내용대로 예제를 하고 있는데 동작하지 않아서 BRIDGE_FIN 폴더(완성된 예제)를 그대로 다운받아서 실행을 해도 동일하게 SpotLight가 동작하지 않는 것 같습니다. 아래와 같이 빛이 없습니다. node 버전 : 18.17.0확인 부탁드립니다.
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
3D 공간에서 움직이는 캐릭터 3 에서 y좌표가 이상해요
3D 공간에서 움직이는 캐릭터 3 강의에서 function checkIntersects() { console.log(item.point)} 위 코드에서 마우스를 화면상 위로 down & move 하면, y 좌표가 계속 증가하고, 아래쪽으로 하면 y좌표가 계속 감소하는데,실제로는 y좌표는 0으로 고정되어야 하는것 아닌가요?x좌표와 z좌표는 당연히 변경되는게 맞는데, y좌표가 왜 그런건지 궁금합니다. 그리고 이상하게도 일률적으로 y좌표 같이 증가하거나 감소하는것도 아니고, 한번씩 튀는경우도 생기구요.
-
미해결떠먹는 Three.js
Github에서 deploy 하려면 따로 방법이 있나요?
안녕하세요. 수업 잘 듣고 있습니다.다름이 아니라 수업 실습때는 내부에 node_modules에 파일이 있으니까 잘 작동 되는데Github gh-pages이나 url로 deploy 한다고 하면 node_modules/three 폴더가 없으니 실행이 불가능하네요.강제로 node_modules폴더를 포함하기에는 파일수가 너무 많구요ㅠ 혹시 따로 build 하는 방법이 있나요?일부 몇몇 필요파일만 따로 올려서도 시도해봤는데, 로컬에서는 에러 안나도 업로드 후엔 GLTFLoader가 에러나네요.(파일 및 로더 경로는 맞아도 404에러)
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
애니메이션 export 안 될때
gltf 파일로 export 할때강의에서는 mesh만 선택하고 export 하던데, 그랬더니 애니메이션 객체가 전혀 없었습니다.mesh뿐만 아니라 amature(뼈대)도 함께 선택하니(그냥 a로 전부 선택)하니애니메이션 객체도 생겼고, 애니메이션 잘 되네요. 블렌더 버전이 올라가면서 그렇게 동작이 바뀐것이 아닐까요?제가 쓰는 블렌더 4.0.2three.js 0.162.0
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
예제와 보여지는게 다릅니다.
위 사진은 제가 07\07\material_fin\src\ex02.js 를 실행시킨 것이고이 사진은 강의도중 보이는 화면인데 빛의 밝기가 왜 다른걸까요?
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
npm start warning 문제
이전 강의들과 동일하게 readme.txt 파일의 패키지 설치까지는 문제 없이 설치 됩니다만, npm start에서 계속 해당 내용의 오류가 발생합니다. node.js 재설치도 해보고 검색도 해봤지만 해결되는 부분이 없어서 질문 드립니다 ㅠㅠ오늘 다른 강의에서도 같은 내용의 질문이 올라온 것 같던데 어떻게 하면 해결이 될까요?
-
해결됨Three.js로 시작하는 3D 인터랙티브 웹
npm start 시, WARNING in ./node_modules/html-entities/lib/index.js 가 발생합니다.
섹션 3. Transform(변환) 에서 소스코드를 다운로드 받고,VS Code에서 Transform 폴더를 추가한 후,readme.txt의 순서대로,패키지 설치하고,서버 구동을 진행했습니다. npm start 명령 후,아래의 내용과 같이 WARNING과 Failed가 발생합니다. WARNING in ./node_modules/html-entities/lib/index.jsModule Warning (from ./node_modules/source-map-loader/dist/cjs.js):Failed to parse source map from 'Z:\STUDY\04\transform\node_modules\html-entities\src\index.ts' file: Error: ENOENT: no such file or directory, open 'Z:\STUDY\04\transform\node_modules\html-entities\src\index.ts' @ ./node_modules/webpack-dev-server/client/overlay.js 10:0-39 212:28-34 @ ./node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true 12:0-60 135:46-59 242:27-40 273:28-41 추가로 npm version 명령의 결과는,{ 'threejs-study': '1.0.0', npm: '10.2.4', node: '20.11.1', acorn: '8.11.2', ada: '2.7.4', ares: '1.20.1', base64: '0.5.1', brotli: '1.0.9', cjs_module_lexer: '1.2.2', cldr: '43.1', icu: '73.2', llhttp: '8.1.1', modules: '115', napi: '9', nghttp2: '1.58.0', nghttp3: '0.7.0', ngtcp2: '0.8.1', openssl: '3.0.13+quic', simdutf: '4.0.4', tz: '2023c', undici: '5.28.3', unicode: '15.0', uv: '1.46.0', uvwasi: '0.0.19', v8: '11.3.244.8-node.17', zlib: '1.2.13.1-motley-5daffc7'}와 같습니다.
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
회전시 mesh의 중심점 변경하는 방법 문의
transform rotation 강의를 보고 궁금한 점 문의합니다.mesh의 중심으로 회전이 되고 있는데,회전의 기준점을 바꿀 수 있는지 질문 드립니다.
-
해결됨Three.js로 시작하는 3D 인터랙티브 웹
npm start 시 error가 발생합니다.
웹팩(Webpack) 살펴보기 강좌를 진행 중에 있습니다. node.js는 20.11.1 LTS를 다운로드받아서 설치했습니다. 여기서 서버를 구동하기 위해, 터미널에서 npm start를 입력하면 아래와 같은 에러가 발생하고 더 이상 진행되지 않습니다.어떻게 문제를 해결해야 할까요?
-
미해결React Three fiber(R3F)로 배우는 인터렉티브 3D 웹 개발
물질을 클릭했을 때 이벤트
물질에게 클릭이벤트를 주어 보이는 시점이 바뀌거나 물체가 이동할수있게 하고싶습니다.
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
npm start 오류
계속 이렇게 오류가 떠서 캐시 지워서 해보고 다시 설치도 해보고 명령어도 입력해봐도 해결이 안되네요 ㅜㅜ뭐가 문제일까요..
-
해결됨떠먹는 Three.js
WebGL 1 지원 중단에 대해
영상 : [손쉬운 조작 OrbitControls] 에서 three의 경로 설정 중 THREE.WebGLRenderer: WebGL 1 support was deprecated in r153 and will be removed in r163WebGL 1 지원은 r153에서 사용 중단되었으며 r163에서 제거될 예정입니다.라는 메세지가 나왔습니다. 질문 : 이게 나중에는 오류가 날 수 있다는 뜻인가요? 맞다면 어떻게 대비를 해야 하는지 궁금합니다.
-
해결됨떠먹는 Three.js
index.html 실행 시 CORS 문제
현재 [섹션0]까지 수강 완료하였습니다.index.html 파일 실행 시 이렇게 CORS 문제가 발생됩니다.어떻게 해결할 수 있을까요?ㅠㅠ
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
scene에 camera add는 꼭 필요한 건가요?
renderer에서 camera를 render 해주는데, scene에 add가 꼭 필요한건지 궁금해요!scene.add(camera) 를 지웠을 때도 에러메세지 없이 잘 작동이 되는 것 같은데 필요한 코드인가요?만약 필요한 코드라면, scene에 add 된 light와 mesh는 왜 따로 render을 해주지 않는건가요?
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
css가 연결이 안되요 ㅜㅜ
사용방법 3 듣는중인데요 main.css를 연결하려고 하는데 저렇게 뜨는데 무슨 문제일까요?
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
스크롤 페이지 만들기 -땅과 집 색상이 너무 어둡습니다.
- 질문에 대한 답변은 강의자가 하는 경우도 있고, 수강생 여러분들이 해주시는 경우도 있습니다. 같이 도와가며 공부해요! :)- 작성하신 소스코드 자체의 오류보다는, 개념이나 원리가 이해되지 않는 부분을 질문해주시는게 좋습니다. 그대로 따라했는데 소스코드에서 버그가 나는 경우는 99%가 오타에 의한거라서, 완성된 소스랑 찬찬히 비교해보시면 직접 찾으실 수 있을 거예요. 개발자도구 console에 오류로 표시된 부분만 완성 코드에서 복사->붙여넣기를 해보시는 것도 방법입니다.- 먼저 유사한 질문이 있었는지 검색해보세요.- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요 선생님. 강의 따라하다가 색상이 너무 이상해서 문의드립니다. 제가 따라한 코드가 이상한 건가 싶어서 완성파일 main.js를 실행했는데 똑같이 색상이 이상합니다. 수정방향을 알려주시면 감사하겠습니다.
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
PlaneGeometry 브라우저 화면 크기에 맞게 셋팅하는 법
PlaneGeometry 브라우저 화면 크기에 맞게 셋팅하는 법이 있을까요? width, height를 계산해서 넣어야하는데 계산식이 어떻게 되는지 모르겠네요...OrthographicCamera를 사용 중입니다!답변 주시면 감사하겠습니다!
-
미해결Three.js로 시작하는 3D 인터랙티브 웹
Mesh에 Camera를 붙일 수 있나요??
Mesh에 Camera를 붙일 수 있나요??아니면 아래 선생님 사이트처럼 동영상 대신 해당 위치에 Camera를 셋팅할 수 있나요??답변 부탁드리겠습니다!!!
-
해결됨Three.js로 시작하는 3D 인터랙티브 웹
reorder('YXZ') 동작
강의 너무 재밌게 잘 듣고 있습니다!roatation에서 reorder를 했을때 어떻게 동작하는 것인지 정확히 이해가 가지 않아서 질문 남겨봅니다~reorder('YXZ') 는 어떤 것을 위해 설정한 것인지, YXZ 순서가 무엇을 의미하는지 궁금합니다~ (rotation.x, rotation.y 로 값을 설정하는데, YXZ 순서는 어떤 것을 설정해주는 것인지요?)아래 코드처럼 테스트했을때, 1,2번 위치에 설정했을때는 잘 동작하고, 마지막에 설정했을때는 기존처럼 동작하는데, reorder() 해주는 위치도 궁금합니다. (한번 설정하면 계속 동작하는 것인지?)// 1. 회전 전에 설정 mesh.rotation.reorder('YXZ'); mesh.rotation.y = THREE.MathUtils.degToRad(45); // 2. 중간에 설정 mesh.rotation.reorder('YXZ'); mesh.rotation.x = THREE.MathUtils.degToRad(20); // 3. 마지막에 설정 mesh.rotation.reorder('YXZ');