原文链接: regl 形状绘制 简单花瓣
上一篇: regl 圆形色盘
下一篇: regl 随机噪声 实现烟雾或云
https://thebookofshaders.com/07/?lan=ch
import Regl from "regl";
export default async () => {
const regl = Regl();
regl.clear({
color: [0, 0, 0, 1],
depth: 1,
});
regl({
frag: `
precision mediump float;
uniform float u_time;
void main () {
vec2 st = gl_PointCoord.xy;
vec3 color = vec3(0.0);
vec2 pos = vec2(0.5)-st;
float r = length(pos)*2.0;
float a = atan(pos.y,pos.x);
float f = cos(a*3.);
// f = abs(cos(a*3.));
f = abs(cos(a*2.5))*.5+.3;
// f = abs(cos(a*12.)*sin(a*3.))*.8+.1;
// f = smoothstep(-.5,1., cos(a*10.))*0.2+0.5;
color = vec3( 1.0 -smoothstep(f,f+0.02,r),r,f );
gl_FragColor = vec4(color,1.0);
}`,
vert: `
precision mediump float;
attribute vec2 position;
void main () {
gl_Position = vec4(position, 0, 1);
gl_PointSize = 500.0;
}`,
attributes: {
position: [[0, 0]],
},
primitive: "points",
count: 1,
})();
};