WebGL์ด๋ ๋ฌด์์ธ๊ฐ(+ HTML Canvas, WebGL ๊ธฐ์ด) (tistory.com)
WebGL์ด๋ ๋ฌด์์ธ๊ฐ(+ HTML Canvas, WebGL ๊ธฐ์ด)
์ด ๊ธ์ ๋ค์ด๊ฐ๊ธฐ ์์, ํน์ ํ๋ คํ ์ ๋๋ฉ์ด์ ๋ง ๋ณด๊ณ ํฅ๋ฏธ๋ฅผ ๊ฐ์ก๋ค๋ฉด, ํ ๊ฐ์ง๋ฅผ ๋ ์๊ฐํ๋ฉด ์ข์ ๊ฑฐ ๊ฐ๋ค. ์์ํ๊ฒ ์ง๋ง ์ํ์ด๋ค. ๊ฒฐ๊ตญ 3D ๊ทธ๋ํฝ์ ์ธ ๊ฐ์ ์ขํ๋ฅผ ์ ์ผ๋ก ์ฐ๊ฒฐํด์ ์
code-masterjung.tistory.com
WEB GL์ ์น์์์ ๊ทธ๋ํฝ์ ํํํ ๋ ์ฐ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๋ค.
์๋ฐ์คํฌ๋ฆฝํธ ์ธ์ด๋ก ์ฐ์ด๋ฉฐ 2D์ 3D ๊ทธ๋ํฝ์ ํํํ ์ ์๋ค.
WEB GL์ GPU๋ฅผ ์ด์ฉํด์ ๊ทธ๋ฆผ์ ๊ทธ๋ฆฌ๊ธฐ ๋๋ฌธ์ ์ฑ๋ฅ๋ฉด์์ ์ ๋ฆฌํจ์ด ์๋ค.
ํนํ ์น์์์ 3D๋ก ๊ทธ๋ ค์ง๋ ๊ฒ๋ค์ WEB GL๋ก ๊ทธ๋ ค์ก๋ค๊ณ ๋ด๋ ๋ฌด๋ฐฉํ๋ฐ,
WEB GL API๋ค ์์ฒด๊ฐ ๋ก์ฐ๋ ๋ฒจ์ด๋ผ์(๊ฐ๋ฐ์, ๋ฐ๋ฅ๋ถํฐ ๊ตฌํํด์ผํจ) ์์ ๋ํ ํ๋๋ฅผ ๊ทธ๋ฆฌ๋ ค๊ณ ํด๋ ๊ฝค๋ ๋ง์ ์ฝ๋๊ฐ ์์ฑ๋์ด์ผ ํ๋ค. (์์ฐ์ฑ ์ธก๋ฉด์์ ๋จ์ ์กด์ฌ)
three.js๋ ์ด๋ฌํ WEB GL์ ์ฝ๊ณ ๊ฐํธํ๊ฒ ์ฌ์ฉํ ์ ์๋๋ก ๋์์ฃผ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๋ค.
์ํค๋ฐฑ๊ณผ Three.js๋ ์น ๋ธ๋ผ์ฐ์ ์์ 3์ฐจ์ ์ปดํจํฐ ๊ทธ๋ํฝ์ค ์ ๋๋ฉ์ด์ ์์ฉ์ ๋ง๋ค๊ณ ํํํ๊ธฐ ์ํด ์ฌ์ฉ๋๋ ์๋ฐ์คํฌ๋ฆฝํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด์ API์ด๋ค. ์คํ ์์ค ํ๋ก์ ํธ๋ก ๊นํ๋ธ์์ ๊ณต๊ฐ๋์ด ์๋ค.
3D ๋ชจ๋ธ๋ง ์ฌ์ดํธ๋ค์ ํฐ ์ฉ๋์ ๋ฐ์ดํฐ๋ฅผ ๋ก๋ํ๋ค ๋ณด๋, ๋์ฒด๋ก ๋ก๋ฉ ์๊ฐ์ด ํ์ํ๋ค. 3์ฐจ์ ๊ทธ๋ํฝ์ ์น์์ ํํํด์ค ๋ WEB GL three.js๋ฅผ ์ฌ์ฉํ๋ค.
pixi.js๋ PixiJS๋ ์น์ฉ 2D ๊ทธ๋ํฝ ๋ ๋๋ง ๋ผ์ด๋ธ๋ฌ๋ฆฌ. ์บ๋ฒ์ค API์ webgl API๋ฅผ ์๋ FlashAPI๋ก ๋๋ต ๋ชจ๋ธ๋งํ ๊ฐ๋จํ ์ฅ๋ฉด์ ๊ทธ๋ํ๋ก ์ ๊ทํํ๊ธฐ ์ํด MattGroves์ ์ํด ๋ง๋ค์ด์ก๋ค. ๊ทธ ์ฃผ์ ์ด์ ์ ํญ์ ์ฑ๋ฅ์ ์๊ธฐ ๋๋ฌธ์ ๋งค์ฐ ๋น ๋ฅด๋ค. ์ฃผ๋ก canvas2d ํด๋ฐฑ์ด์๋ webGL ๋ ๋๋ง ํ๋ฉด์ด๋ค
PixiJS ๊ณต์ ์น์ฌ์ดํธ: http://www.pixijs.com
PixiJS is a 2D Graphics Rendering library for the web. It was created by Matt Groves to normalize the canvas and webgl APIs into a simple scene graph originally modeled loosely on the Flash API. Its primary focus has always been on performance so that it is really fast. Because of this it is primarily a webGL rendering surface with canvas 2d fallback. Official PixiJS Website:
'๊ทธ๋ํฝ์ค > WebGl' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[Spine][pixiJs] Api ์ฌ์ดํธ (0) | 2022.05.11 |
---|---|
[2D WebGL][pixi.Js] ์ธ๋ถ์ฌํญ (0) | 2022.05.10 |
[2D WebGL][pixiJS] Getting Started! (0) | 2022.05.09 |
[2D WebGL][pixiJS] Architecture Overview (0) | 2022.05.09 |
[3D WebGL][three.js] three.js ํ๋ก์ ํธ ์์ํด๋ณด๊ธฐ (0) | 2022.05.09 |