[TIL] - 'pannellum-react' & 'WebGL'(feat.Three.js)

pyk0844·2022년 12월 27일
0

회사에서 새로 진행할 프로젝트에 pannellum, webGl을 사용하기에 공부가 많이 필요했다.
예제 프로젝트를 받아서 분석중인데 아무리 봐도 어려워서, 더 쉬운 예제들을 따로 찾아 연습하기로 결정했다.


그렇게 생성한 공부용 플젝.....

오늘 공부한(?) 내용만 대강 정리해보자면...
1.pannellum
panorama 이미지만 넣어주고, 약간의 설정만 해주면 알아서 viewer를 만들어 준다.

2.pannellum-react(필수x)
pannellum과 같은 방식으로 사용하는데, react+jsx 방식으로 활용할 수 있다.

3.WebGL
WebGL은 html의 캔버스 요소를 이용하여 웹 브라우저에서 인터렉티브 한 3D 그래픽을 사용할 수 있도록 하는 도구이다. 웹 브라우저에서 CPU가 아닌 GPU를 사용하여 화면을 렌더링 하여 빠른 속도가 장점 이라고 한다.

4.Three.js(필수x)
Three.js는 WebGL을 이용하여 웹페이지에 3D 객체를 쉽게 렌더링 하도록 도와주는 자바스크립트 3D 라이브러리이다.

........................
아직 분석이 많이 필요하지만 우리 플젝에서는 전체적인 틀을 pannellum으로 잡고, 디테일을 WebGL로 잡는 것으로 보인다.
........................

요즘 기분이 다운되있을 때가 많아서 동기부여가 많이 필요한 상황이었는데,,, 생각해보니 TIL 작성한 적이 없었던 것 같다...

하루하루 뭐라도 배우고 지나가면 그것도 다 의미가 있는 것을... 자꾸 잊고 살다가 점점 작아지는 기분..ㅠ

앞으로 종종 써봐야 겠다...

참고
pannellum-react doc
pannellum doc
WebGL이란 무엇인가?
WebGL reference
WebGL 텍스터, 쉐이더
three.js

0개의 댓글