Shader特效——“Cell Merge”的实现【ShaderToy】
发表于2018-02-07
下面给大家介绍用ShaderToy实现的Cell Merge。
效果图:

GLSL代码及注释:
vec3 color_bg = vec3(0.0);
vec3 color_inner = vec3(1.0,0.9,0.16);
vec3 color_outer = vec3(0.12,0.59,0.21);
//vec3 color_outer = mix(color_bg, color_inner, 0.3); // also nice effect
float timeScale = 1.0; // 时间(速度)的缩放尺度
float mapScale = .8; // cell的缩放尺度
#define cellCount 20.0
// size in pixels inner/outer with mapscale 1.0
// cell的内圈大小和外圈大小
vec2 cellSize = vec2(30.0, 40.0);
vec3 powerToColor(vec2 power)
{
// 控制颜色平滑程度
float tMax = pow(1.12, mapScale*3.2);
float tMin = 1.0 / tMax;
vec3 color = mix(color_bg, color_outer, smoothstep(tMin,tMax,power.y));// 外圈颜色
color = mix(color, color_inner, smoothstep(tMin,tMax,power.x)); // 内圈颜色
return color;
}
vec2 getCellPower( vec2 coord, vec2 pos, vec2 size )
{
vec2 power;
// 当前像素离cell越远,power越小,反之越大
power = (size*size) / dot(coord-pos,coord-pos);
power *= power * sqrt(power); // ^5
return power;
}
void mainImage( out vec4 color, in vec2 coord )
{
float T = iGlobalTime * .1 * timeScale / mapScale;
vec2 hRes = 0.5*iResolution.xy;
vec2 pos;
vec2 power = vec2(0.0,0.0);
for(float x = 1.0; x != cellCount + 1.0; ++x)
{
// 随机cell的位置
pos = hRes * vec2(sin(T*fract(0.246*x)+x*3.6)*cos(T*fract(0.374*x)-x*fract(0.6827*x))+1.,
cos(T*fract(0.246*x)+x*3.6)*sin(T*fract(.374*x)-x*fract(0.6827*x))+1.);
// 根据当前像素的coord和cell的pos和size计算cell的power
power += getCellPower(coord.xy, pos, cellSize*(.75+fract(0.2834*x)*.25) / mapScale);
}
color.rgb = powerToColor(power);
}
