中文入门教程: thebookofshaders.com/ https://webglfundamentals.org/webgl/lessons/zh_cn/webgl-shaders-and-glsl.html http://www.webgl3d.cn/WebGL/ https://juejin.cn/post/7055552513738539022 在线编程工具: https://www.shadertoy.com/ http://editor.thebookofshaders.com/ https://cyos.babylonjs.com/ 国内入门教程: https://juejin.cn/post/7055552513738539022 着色器展览馆 https://www.shadertoy.com/results
一、基础
常见着色器输入(参考https://www.shadertoy.com/)
uniform vec3 iResolution; // viewport resolution (in pixels)
uniform float iTime; // shader playback time (in seconds)
uniform float iTimeDelta; // render time (in seconds)
uniform int iFrame; // shader playback frame
uniform float iChannelTime[4]; // channel playback time (in seconds)
uniform vec3 iChannelResolution[4]; // channel resolution (in pixels)
uniform vec4 iMouse; // mouse pixel coords. xy: current (if MLB down), zw: click
uniform samplerXX iChannel0..3; // input channel. XX = 2D/Cube
uniform vec4 iDate; // (year, month, day, time in seconds)
uniform float iSampleRate; // sound sample rate (i.e., 44100)
babylon.js的默认输入:
因为显卡的架构,所有线程的输入值必须统一(uniform),而且必须设为只读。也就是说,每条线程接收相同的数据,并且是不可改变的数据。
你可以把 uniforms 想象成连通 GPU 和 CPU 的许多小的桥梁。虽然这些 uniforms 的名字千奇百怪,但是在这一系列的例子中我一直有用到:u_time (时间), u_resolution (画布尺寸)和 u_mouse (鼠标位置)。按业界传统应在 uniform 值的名字前加 u_ ,这样一看即知是 uniform。尽管如此你也还会见到各种各样的名字。
-
书籍
常见问题
1 float计算问题
GLSL 语言规格比C语言更加严格,比如说-号,就要求两边均强制为float,必须用float()再次转换。
float utime = time - float(int(time));