threejs 오브젝트 출력, 텍스쳐 입히기, 마우스 스크롤로 회전(임시) 샘플

어쩌다 보니 threejs파일에 대해서 조금 알아보게되었다.

 

3d로 만들어진 오브텍트와 텍스쳐를 입히는게 가능하고 웹상에서 다양한 이벤트들에 대해서도 동작을 시킬 수 있는것 같다.

 

나도 정확히 몰라서 다른 블로그, 티스토리 들을 찾아다녔으며 오브젝트 출력, 텍스쳐 입히기 소스를 찾았으나 화면에 뜨지 않았다.

 

여기에서 중요한점은

 

* 로컬에서 실행 하더라도 웹 서버를 이용해서 테스트 할것(그러지 않을 시 파일 읽어 들이는데 오류 발생)

* 마우스 스크롤로 회전은 임시로 만든건데(정말 임시로...) 어떻게 스크롤로 이동 시켜야할지 아직은 OrbitControls를 정확히 모르겠다. 그래서 하다보니 임시로 offset값을 + 또는 - 로 줘서 회전하도록 변경하였다.

 

그리고 가장 도움이 된 곳의 링크

 

https://dev-t-blog.tistory.com/25

[threejs] MTL Loader 로 OBJ Loader 모델에 텍스쳐를 입혀보자-05

 

 

위의 티스토리에 있는 소스를 사용하였으며, 바로 동작은 하지 않았었다.(버전이 바뀌면서 라이브러리에 사용되는 파일들이 조금 변화가 있는듯 했다.

 

그래도 위의 링크에 설명이 자세하니 저기를 보고 소스 실행은 여기에 첨부한것을 보면 될듯 하다.

 

obj-mtl-loader.zip

1.05MB