@absulit/points
Version:
A Generative Art library made in WebGPU
56 lines (52 loc) • 1.7 kB
JavaScript
/* @ts-self-types="./sdf.d.ts" */
const sdfSegment=`
fn sdfSegment(p:vec2f, a:vec2f, b:vec2f) -> f32{
let pa = p-a;
let ba = b-a;
let h:f32 = clamp( dot(pa,ba)/dot(ba,ba), 0.0, 1.0 );
return length( pa - ba*h );
}
`;const sdfLine=`
fn sdfLine(p1:vec2f, p2:vec2f, pixelStroke:f32, uv:vec2f)->f32{
let d = sdfSegment(uv, p1, p2);
var value = 1.0;
if(d > pixelStroke/800.){
value = 0.;
}
return value;
}
`;const sdfCircle=`
fn sdfCircle(position:vec2f, radius: f32, feather: f32, uv:vec2f) -> f32 {
let d = distance(uv, position);
let st = 1. - smoothstep(radius, radius + feather, d);
return st;
}
`;const sdfSquare=`
fn sdfSquare(position:vec2f, radius:f32, feather:f32, rotationRads: f32, uv:vec2f) -> f32 {
let positionRotated = rotateVector(position, rotationRads);
let uvRotated = rotateVector(uv, rotationRads);
var d = distance(uvRotated.x, positionRotated.x );
var s = smoothstep(radius, radius + feather, d);
d = distance(uvRotated.y, positionRotated.y);
s += smoothstep(radius, radius + feather, d);
s = clamp(0., 1., s);
return 1-s;
}
`;const sdfLine2=`
fn sdfLine2(p1:vec2f, p2:vec2f, feather:f32, uv:vec2f)->f32{
let d = sdfSegment(uv, p1, p2);
var s = smoothstep(0, feather, d);
return 1-s;
}
`;const sdfSmooth=`
fn sdfSmooth(color:vec4f) -> vec4f {
var finalColor = color;
var spread = fwidth(finalColor.a);
spread = max(spread * .75, .001);
finalColor.a = smoothstep(.5 - spread, .5 + spread, finalColor.a);
// if(finalColor.a <= 0.){
// discard;
// }
return finalColor;
}
`;export{sdfCircle,sdfLine,sdfLine2,sdfSegment,sdfSmooth,sdfSquare};