1
0

Shape.js 1.0 KB

1234567891011121314151617181920212223242526272829
  1. import { Fn, float, length, smoothstep, uv } from 'three/tsl';
  2. /**
  3. * Returns a radial gradient from center (white) to edges (black).
  4. * Useful for masking effects based on distance from center.
  5. *
  6. * @tsl
  7. * @function
  8. * @param {Node<float>} [scale=1.0] - Controls the size of the gradient (0 = all black, 1 = full circle).
  9. * @param {Node<float>} [softness=0.5] - Controls the edge softness (0 = hard edge, 1 = soft gradient).
  10. * @param {Node<vec2>} [coord=uv()] - The input UV coordinates.
  11. * @return {Node<float>} 1.0 at center, 0.0 at edges.
  12. */
  13. export const circle = Fn( ( [ scale = float( 1.0 ), softness = float( 0.5 ), coord = uv() ] ) => {
  14. // Center UV coordinates (-0.5 to 0.5)
  15. const centered = coord.sub( 0.5 );
  16. // Calculate distance from center (0 at center, ~0.707 at corners)
  17. const dist = length( centered ).mul( 2.0 );
  18. // Calculate inner and outer edges based on scale and softness
  19. const outer = scale;
  20. const inner = scale.sub( softness.mul( scale ) );
  21. // Smoothstep for soft/hard transition
  22. return smoothstep( outer, inner, dist );
  23. } );
粤ICP备19079148号