Scientific Computing & Data Science

이번 글에서는 HTML5 JavaScript 챠트(Chart)인 CanvasJS 에 대하여 소개하고자 한다. HTML5 기반에서 다이내믹한 데이터 시각화를 위한 챠트를 제공하는 방법은 Flash 플러그인을 사용하거나 SVG(Scalable Vector Graphics), Canvas 등 표준 렌더링 태그를 사용하는 방법이 있다. 대부분 아다시피 Flash는 보안 문제 등으로 인해 점점 설 자리를 잃어가는 추세인 만큼, HTML5 표준 렌더링 태그를 사용하는 것을 강력히 추천한다. SVG와 Canvas는 각각의 장점과 단점이 있는 만큼 이들을 잘 파악하여 사용 목적에 따라 적절히 사용하는 것이 좋다. 이들에 대한 비교는 다음 링크에 잘 정리되어 있다: https://msdn.microsoft.com/ko-..

이번 예제는 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..

이번 예제는 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..

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

원문: http://www.itworld.co.kr/news/94723 어도비 플래시(Adobe Flash)는 오랫동안 보안 취약점을 노출해왔으며, 해커들은 악성코드를 유포하는 매개체로 플래시를 활용했다. 최근 해킹 팀(hacking Team) 사건으로 플래시에 대한 우려가 여느 때보다 높아진 가운데, 전세계적으로 어도비 플래시를 퇴치하는 막바지 작업이 한창이다. 기업에서도 플래시 대신 HTML5를 표준 기술로 적극적으로 도입하고 있는데, 성능과 보안 측면에서 모두 플래시보다 월등하다는 이유에서다.과거 플래시는 유튜브와 넷플릭스 같은 동영상 스트리밍 서비스와 알디오(Rdi) 같은 음악 사이트, 뉴그라운드(Newgrounds) 같은 게임 포털의 기본 플러그인이었다. 2010년만 하더라도 플래시는 전세계 9..

by Geol Choi | September 8, 2014 이번 글에서는 Node.js의 패키지 모듈인 Express 4를 이용하여 웹 어플리케이션의 템플릿 생성에 대해 알아보도록 하겠습니다. 우선 각자의 시스템에 Node.js가 설치되어 있음을 가정합니다.1. Express 4 설치Node.js가 설치되어 있으면 npm, 즉 Node Package Manger가 같이 설치됩니다. 우선 쉘(Mac OS는 Terminal, Windows는 Console)을 실행합니다. 설치 시 자동으로 전역 환경변수가 설정되므로 경로에 관계없이 npm 명령이 실행됩니다. Express 4를 설치하기 위해 다음과 같이 명령을 입력합니다: $ sudo npm install -g express 설치옵션 -g는 전역(글로벌) 환..

원문 : http://www.ciokorea.com/news/21219 개발자의 채용 기회를 높이는 좋은 전략 중 하나는 새로운 프로그래밍 언어를 학습하는 것이다. 문제는 어떤 언어를 배우느냐는 것이다.개발자 채용 사이트를 들여다보면 수요가 많은 프로그래밍 언어를 파악할 수 있다. 그리고 지금 당장은 자바, C, C++, 오브젝티브(Objective) C 같은 프로그래밍 언어, 파이썬(Python), PHP, 루비(Ruby), 자바스크립트(JavaScript) 같은 스크립트 언어, SQL 데이터베이스 프로그래밍 능력을 갖추고 있는 프로그래머들이 인기다.하지만 미래에 좋은 일자리를 차지하기 위해 한 발 앞서 나가고 싶다면 자바나 파이썬 같은 일반적인 언어 이상을 공략해야 한다.지금 당장은 아니지만, 미래에..