Tech 개발 블로그

한 영역 안에서 만들어진 물체(Mesh)를 가만히 있는게 아니라 마우스를 가져다 댔을 떄, 빙글빙글 돌 수 있도록 만들어보는 연습을 해보았다. 마우스의 포인터를 가지고 현재 가리키고 있는 영역이나 물체를 알려줄 수 있는 Raycaster 클래스를 사용했다. 먼저 아래는 Three.js의 공식 문서에서 얘기하는 Raycaster https://threejs.org/docs/index.html#api/en/core/Raycaster three.js docs threejs.org Raycaster는 raycasting을 기반으로 만들어진 클래스다. Raycasting은 다른 여러 물체들 사이에서 마우스로 하나의 물체를 선택하는데 사용된다. (그러므로 무궁무진하게 많이 사용될수 있다!) 광선의 위치(마우스 포인..

React360 다음으로 3D렌더링을 좀더 복잡하고 정교하게 구현하기 위한 WebGL 라이브러리 중 가장 대표적인 Three.js Three.js는 자바스크립트 3D 라이브러리로 WebGL을 기반으로 하고 있다. 물론 WebGL을 가지고 3D를 만들 수 있지만.. Canvas나 SVG처럼 단순한 형식으로만 제공되기 때문에 코드량이 많아진다고 한다! 그래서 이걸 좀더 쉽게 도와주는 라이브러리가 바로 Three.js 다. (물론 쉽지는 않은거 같...) 아래는 Three.js 의 공식 홈페이지! https://threejs.org/ three.js – JavaScript 3D library threejs.org 한글문서로 매우 친절하게 설명을 해주는 페이지가 있다!(감사합니다..) https://threej..