굴러가유...

안녕하세요!! 오늘은 THREE.js를 사용해서 화면에 100개의 Mesh를 랜덤하게 뿌려보는 소스를 작성해보려고 합니다. 강의를 통해 많이 배우긴 했지만.. 너무 내 지식이 아닌 것 같아서.. 다시 듣는 중이랍니다. 오늘은 간단하게 THREE.js를 사용, 똑같은 Mesh를 100개 만들어 x, y, z 값만 랜덤하게 배정하는 것을 해볼 것입니다! index.html 우리는 box.js를 불러와 사용할 것으로, src설정, type='module'로 불러옵니다. 로컬에서 테스트를 하기 위해선 vscode의 extensitions에서 liveserver 를 설치하는것을 권장합니다! // index.html box.js 기본 설정을 진행해야 합니다. 우리는 THREE.js와 OribitControl을 사용..

안녕하세요! 오늘은 자바스크립트를 사용해서 three.js의 기초를 살짝 맛보려고 합니다. three.js는 3D웹을 만드는 데 사용하는데요, 소스도 올려둘 테니 한번 다운받아 사용해 보시면 더 좋은 경험이 될 것입니다. 깃허브 소스보기 three.js 맛보기 three.js 의 기본 설정 (렌더, 씬, 카메라, 메쉬, 애니메이션, 리사이징) 에 대한 기본적인 소스를 공유하기 위해 만들어진 페이지입니다. html 의 canvas? 일종의 도화지라 생각하면 된다. 도화지의 크기는 window.innerWidth 와 window.innerHeight 의 크기로 설정을 한다. THREE.WebGLRenderer ? const renderer = new THREE.WebGLRenderer({ canvas, an..