iPhone(iPod) 어플리케이션을 Adobe Flash CS5로 개발 가능 하나, Apple App Store를 통한 배포는 불가능하다. 얼마전 Apple측의 약관에 Apple가 공급하는 개발 도구가 아닌 다른 것을 이용하여 개발된 응용프로그램은 iPhone(iPod)에서 사용할 수 없다는 내용이 추가 되었기 때문이다. Windows기반에서 Ope...
GPU based Geometry Clipmaps
아래는 GPU Based Geometry Clipmaps라는 논문을 구현해본 결과이다. 속도도 빠르고 품질도 괜찮기는 하지만 본 내용을 구현하기 위해서는 여러가지 꼼수(?)들을 많이 사용해야 한다. 4096 x 4096 Height map 과 4096 x 4096 Color texture 를 이용한 결과는 아래와 같다. 대한민국 남한의 8192...
WebGL-010: Text Rendering
WebGL을 이용하여, Text Rendering을 하는 것은 JavaScript의 지식을 비교적 많이 필요로 한다. 그 외에는 WebGL의 사각형에, JavaScript로 렌더링된 Text 이미지를 텍스쳐링하는 것만 수행하면 된다. Windows platform에서 OpenGL의 wgl을 이용하여 text를 렌더링해본 경험이 있다면, 혹은 glut를...
WebGL-009: Texture
이번에는 WebGL에서 Geometry에 Texture를 입혀보는 예제를 소개하도록 하겠다. Local System에서 작동되는 OpenGL 프로그램에서의 Texture로딩은 Local Disk에 저장되어 있는 Image 파일을 읽어들여 사용함을 잘 알고 있을 것이다. 그렇다면, Web상에서 작동하는 WebGL은 어떻게 Texture를 로딩할 것인가?...
WebGL-008: JavaScript 파일 분할
WebGL을 위한 JavaScript의 코드가 조금씩 길어짐에 따라, 소스 코드의 관리 및 가독성이 점점 떨어 지고 있다. 따라서 이번 문서에서는 WebGL을 위해 JavaScript 코드를 어떻게 사용할 것인가에 대한 내용을 살펴볼 것이다. 지금 까지는 하나의 *.html 파일에 모든 코드가 들어가 있는데, 이후 부터는 *.html파일과 *.js파...
WebGL-007: Simple animation
이번에는 WebGL을 이용한 Animation을 표현해 보도록하겠다. OpenGL이든 Direct3D이든 Geometry에 대한 연산을 행렬 형태로 표현하고 있다. 이동/회전/크기변환 등을 행렬로 표현하면 여러가지 장점이 있어 사용할 뿐 필수 사항은 아닐 것이다. 이번 장에서는 행렬을 사용하지 않고 아주 간단한 Animation을 표현할 것인데, 그 ...
WebGL-006: Draw a colored triangle
이전의 예제 004. WebGL - Prac03 - DrawPoints, DrawLines, DrawTriangles. 에서 단색의 삼각형을 렌더링하여 보았다. 이는 아래와 같이 Fragment Shader에서 붉은색으로만 색상값을 지정하고 있기 때문이다. <script id="FragmentShader" type="x-shader/x-vert...
WebGL-005: Shader를 위한 Script 구문
이전 글에서 Vertex/Fragment Shader를 이용한 렌더링 방법에 대해 알아 보았다. 해당 게시글에서 사용된 GLSL은 매우 짧아서, var vertexShaderDesc = "attribute vec3 aPos; void main(){ gl_Position=vec4(aPos, 1.0); }"; var fragmentShaderDes c =...
WebGL-004: DrawPoints, DrawLines, DrawTriangles.
이번에는 WebGL에서 기본적인 primitives(Point, Line, Triangle, Rectangle, Polygon etc)를 그리는 방법에 대해 알아보도록 하겠다. About WebGL에서 설명한 바와 같이 WebGL은 OpenGL ES 2.0을 기반으로 한다. 이는 이전 버전의 OpenGL API를 다루어본 사람에게는 중요한 사항인데, ...
WebGL-003: ClearColor
Graphics의 “Hello World”라고 생각되는 ClearColor(BackBuffer Clearing)를 통해 WebGL의 첫번째 예제를 작성해 보도록 하겠다. WebGL을 작성하기 위해서는 약간의 JavaScript와 OpenGL의 몇몇 API 정도만 알고 있으면 된다. <html> <head> <titl...
WebGL-002: Environment Setting
WebGL을 실행하기 위해서는 WebGL대응 Web browser설치와 해당 브라우저에서 WebGL을 수행하기 위한 옵션 설정을 해 주어야 한다(아직까지 MS Internet Explorer는 WebGL을 지원에대한 움직임을 보이지 않는다고 함). FireFox 다음의 링크에서 OS에 맞는 FireFox를 받아 설치한다. http://...
WebGL-001: About WebGL
http://www.khronos.org/webgl/에서 WebGL에 대한 정보를 얻을 수 있다. WebGL은, HTML5를 기반으로하는 OpenGL ES 2.0의 JavaScript바인딩이다. OpenGL ES 2.0 기반답게, Vertex Shader / Pixel Shader(or Fragment Shader)를 통한 GPU 가속이 가능하다...
곡률 기반 라인 생성 소스 코드
아래는 곡률 기반 라인 생성의 C/C++ 언어로 작성된 소스코드이다. Visual Studio에서 작업하였다. DirectX Version OpenGL Version
Curvature Based Silhouette Rendering
1. Line Strip, 각 Point들의 Angle 얻기 위 그림에서 라고 할 경우, 두 벡터 V1, V2 가 이루는 각은 이다. 프로그램 코드는 아래와 같다. float calcAngle( const Point2D& p1, const Point2D& p2, const Point2D& ...
NPR Line Drawing
Hertzman, Curve Analogies, 13th Eurographics Workshop on Rendering, pp. 233-246(2002) Strassman, S., Hairy brushes, SIGGRAPH ‘86 Hsu, S.C., Skeletal Strokes, Proceeding of the 6th annual ACM...
ID3DXRenderToSurface, IDirect3DSurface9
We can use ‘ID3DXRenderToSurface’ or ‘IDirect3DSurface9” for Post Processing. but ID3DXRenderToSurface is slower than IDirect3DSurface9. //복구를 위해 저장해 둠. IDirect3DSurface9* pOldRT; gd3dDevice-&...
3D 수묵화 렌더링
// V: Direction of view // N: Mesh normal E = V · N if( E ≥ 0 && E ≤ Threshold ) E is Edge else E is Omitted texColor; g = texColor.r * 0.3 + texColor.g * 0.59 + texColor.b * 0.11; //...
Motion Blur
금일 뭔가 실수를 했는데, 오히려 괜찮다고 생각되는 현상(모션 블러와 비슷한 효과)이 나타남. 본 캡쳐화면은 뱀(?)으로 생각되는 메쉬로서 정지 상태에 있다. 본 캡쳐화면은 메쉬를 회전 시켰을 경우 나타나는 모션 블러와 비슷한 결과화면 이다. 이유는 아직 잘 모르겠으나, 원인은 렌더링 순서를 실수로 바꾸면서 나타난 현상이다. ( (실루엣...
Havok & Physics
사실감 있는 게임을 위해서는 진보된 그래픽 기술뿐만 아니라 여러 가지의 다른 기술이 필요하다. 그 중 하나가 물리(Physics) 효과를 현실감 있게 구현하는 기술 라고 할 수 있다. 그래픽 기술은 이미 배치된 오브젝트들을 화면에 어떻게 표현할 것인가에 대한 것이라면, 물리 기술은 화면에 표시될 오브젝트들을 어떻게 배치할 것인가에 대한 답이 된다. ...
Edge Effect
V(View vector)와 N(Normal vector on surface of mesh)이 있다고 할 때, dot(V, N)을 계산한다고 생각해 보자. vector V와 N의 내적된 결과는 -1 ≤ result ≤ 1 의 값을 범위로 갖는다. result가 0보다 작은 경우에는 backface가 되고, result가 0인 경우는 N이 V에 수직...