WebGL
https://www.youtube.com/watch?v=f-9LEoYYvE4
Fireship
WebGL How It Works
1. 將vertices(或資料流)轉換為clip space vertices
2. 基於第一步繪製像素
GLSL
GLSL で解き放つ!WebGL シェーダーが生み出す魔法体験
shader
vertex shader
fragment shader
Graphics Library Shader Language
文法以C語言為基礎
UV座標
往右、往上為正值
vec2 uv = (gl_FragCoord.xy / resolution.xy - 0.5) * 2.0;
改為以畫面中央為原點
WebGL Shaders and GLSL
WebGL Water
WebGL Fluid Simulation
2019-05-23 ブラウザ上でカラフルな光の渦を自由に作って流体の動きを思う存分観察できる「WebGL Fluid Simulation」 - GIGAZINE
https://x.com/andreasgysin/status/1885667969084105028
X–Y–Z