GLSL 效果示例
水面折射：让背景图像沿同心波纹扭曲
波纹本身不着色；看背景中的直线怎样随波峰弯曲。
在线示例
修改右侧代码，左侧预览会实时更新。
观察什么
波纹本身不着色；看背景中的直线怎样随波峰弯曲。
实现原理
波的径向导向量只改变取样坐标，不把正弦波直接当作颜色。观察背景直线如何被弯曲。
找到控制效果的代码
float r=length(p),wave=sin(r*35.-u_time*4.)*exp(-r*2.);vec2 q=uv+normalize(p+vec2(.0001))*wave*(.005+.04*u_parameter);c=texture2D(u_texture,q).rgb;
动手修改
把径向频率 r*35. 改为 r*18.。更少、更宽的波纹会弯曲测试图的直线，向外传播的相位仍使用 -u_time*4.。
调试与成本
一次图像采样使用偏移后的 q，波纹并非直接画成彩色圆环。把 .005+.04*u_parameter 设为 0.，即可去掉全部折射并恢复原图，波形计算本身仍会执行。