필터 셰이더는 캔버스에 있는 그 어떤 것에도 효과를 적용할 수 있는 방법입니다. 이 예제에서는, 비디오에 효과가 적용됩니다.
필터 셰이더(Filter Shader) (p5.strands): Created by Dave Pagurek. Remixed by Dorine Tipo. From 2026 onwards, edited and maintained by p5.js Contributors and Processing Foundation. Licensed under CC BY-NC-SA 4.0.
You can find the code history of these examples here: 2023 code, 2026 p5.strands translation. You can suggest improvements by contributing to the current website!
관련 예제

대체 텍스트 없음
필터 셰이더(Filter Shader) (p5.strands)
셰이더로 이미지를 조작합니다.

대체 텍스트 없음
필터 셰이더(Filter Shader) (GLSL)
셰이더로 이미지를 조작합니다.

대체 텍스트 없음
셰이더로 위치 조정하기 (p5.strands)
셰이더를 사용하여 도형의 정점을 조정합니다.

대체 텍스트 없음
셰이더로 위치 조정하기 (GLSL)
셰이더를 사용하여 도형의 정점을 조정합니다.

대체 텍스트 없음
프레임버퍼 흐림(Framebuffer Blur)
카메라의 심도(depth of field)를 시뮬레이션합니다.

A gradient from red to blue.
Gradient (p5.strands)
Draw a radial gradient between two points in p5.strands.

A dithered gradient from red to blue.
Dithered Gradient (p5.strands)
Draw a dithered radial gradient between two points in p5.strands.

A row of five orange spheres. The closest and farthest spheres from the camera appear blurred.
Depth Blur (p5.strands)
Simulate a camera's depth of field, with a shader written in p5.strands.

A city scene blurred around the edges of the frame
Variable Blur (p5.strands)
Create a blur shader with a different amount of blur at different parts of the canvas.