Scientific Computing & Data Science

이번 예제는 Path Tracing 알고리즘을 이용한 렌더링에 관한 것입니다. Path Tracing에 대한 자세한 내용은 다음 링크를 참고합니다:http://cs.brown.edu/courses/cs224/papers/mc_pathtracing.pdfDownload Protect FULL SCREEN 아래 화면에서 클릭 & 드래그하여 Sphere 움직여 보세요~~webgl-path-tracing.js1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909..

이번 예제는 Blur Shader 구현에 관한 것입니다. 본 포스팅에 삽입한 Shader Code는 zz85에게 저작권이 있음을 알려둡니다: Visit zz85's Web Page.Download Project Click here to view with full screen mode OperationsMouse Left Button Click & Drag: Camera RotatingMouse Wheel: Camera Zoom In & OutMouse Right Button Click & Drag: Camera Panningmain.js12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152..

이번 예제는 Bloom Shader 구현에 관한 것입니다. 또한 Shader Code는 Alfred Qualia에게 저작권이 있음을 알려 둡니다:Visit Alfred Qualia's Web Page.Download Project Click here to view with full screen mode OperationsMouse Left Button Click & Drag: Camera RotatingMouse Wheel: Camera Zoom In & OutMouse Right Button Click & Drag: Camera Panningmain.js123456789101112131415161718192021222324252627282930313233343536373839404142434445464..

이번 예제는 Dot Screen Shader 구현에 관한 것입니다. 또한 Shader Code는 Alfred Qualia에게 저작권이 있음을 알려 둡니다:Visit Alfred Qualia's Web Page.Download Project Click here to view with full screen mode OperationsMouse Left Button Click & Drag: Camera RotatingMouse Wheel: Camera Zoom In & OutMouse Right Button Click & Drag: Camera Panningmain.js1234567891011121314151617181920212223242526272829303132333435363738394041424344..

이번 예제는 Vignette Shader 구현에 관한 것입니다. Vignette Shader에 대한 자세한 내용은 다음을 참고하시기 바랍니다: https://github.com/mattdesl/lwjgl-basics/wiki/ShaderLesson3 또한 Shader Code는 Alfred Qualia에게 저작권이 있음을 알려 드립니다:Visit Alfred Qualia's Web Page.Download Project Click here to view with full screen mode OperationsMouse Left Button Click & Drag: Camera RotatingMouse Wheel: Camera Zoom In & OutMouse Right Button Click & Dra..

이번 예제는 Sepia Shader 구현에 관한 것입니다. 다음 링크를 통해 Sephia Shader에 대한 자세한 내용은 다음을 참고하시기 바랍니다:https://alastaira.wordpress.com/2013/12/02/sepia-shader/ 또한 Shader Code는 Alfred Qualia에게 저작권이 있음을 알려드립니다:Visit Alfred Qualia's Web Page.Download Project Click here to view with full screen mode OperationsMouse Left Button Click & Drag: Camera RotatingMouse Wheel: Camera Zoom In & OutMouse Right Button Click & Dra..

이번 예제는 HTML 페이지를 Plane 오브젝트에 Embedding 하는 방법에 대한 것이다.Download Project Click here to view with full screen mode OperationsMouse Left Button Click & Drag: Camera RotatingMouse Wheel: Camera Zoom In & OutMouse Right Button Click & Drag: Camera Panningmain.js12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576..

이번 예제는 특정 오브젝트가 마우스 클릭해 반응하도록 하는 것입니다. 마우스 포인터가 놓여진 오브젝트를 인식시켜 클릭 시 그 오브젝트가 회전하도록 합니다.Download Project Click here to view with full screen mode Operations 해당 카드를 마우스 클릭 main.js123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110..

이번 예제는 마우스 드래그를 통해 컨텐츠를 컨트롤 하는 것에 관한 것입니다. 개인적으로는 본 테스트 프로젝트를 만들면서 꽤 재밌었던 기억이 납니다. 매우 심플하지만 응용하면 요긴한 프로젝트라는 생각이 듭니다.Download Project Click here to view with full screen mode OperationsMouse Left Button Click + Dragmain.js123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293..

이번 글은 Leap Motion Controller를 이용한 오브젝트 컨트롤에 대한 두번째 예제이다. 아쉽게도 현재 필자는 개발 당시에는 Leap Motion Controller를 가지고 있었으나, 현재는 보유하고 있지 않아 본 테스트 프로젝트가 제대로 작동하는지 검증을 할 수 없는 상태이다.다만, 개발 당시에는 본 테스트 프로젝트가 정상 작동하였었기 때문에 일단 올려본다. Leap Motion Controller를 가지고 계신 분은 테스트 해 보시기 바란다. [Download Project] FULL SCREEN [main.js]// standard global variables var container, scene, camera, renderer, controls, stats; var keyboard..