Différences

Ci-dessous, les différences entre deux révisions de la page.

--- ressource:code:processing:shaders [2022/09/07 10:24]
gweltaz
+++ ressource:code:processing:shaders [2023/04/25 18:13] (Version actuelle)
zemog [Variables uniform communes à tous les shaders dans Processing]
@@ Ligne 1: / Ligne 1: @@
+{{tag>processing shaders}}
 ====== Initiation aux Shaders avec Processing ======
 ===== Le hello World des shaders =====
+Les fichiers ''vert.glsl'' et ''frag.glsl'' sont à placer dans le dossier ''data'' du sketch.
 <accordion><panel title="shader_01">
@@ Ligne 19: / Ligne 22: @@
 </code>
-<code glsl freg.glsl>
+<code glsl frag.glsl>
 #ifdef GL_ES
 precision mediump float;
@@ Ligne 54: / Ligne 57: @@
 ===== Communication entre l'application et les shaders =====
+{{ :ressource:code:processing:shader_comm.png?direct |}}
 L'application (programme Processing) peut envoyer des données vers les shaders par des variable déclarées avec le mot-clé ''uniform''.
+==== Fonctions GLSL ====
+  * step(seuil, val)
+    Renvoi 0. si val < seuil, renvoi 1. si val > seuil
+  * smoothstep(seuil1, seuil2, val)
+  * clamp()
+  * pow()
+  * fract()
+    Returns the fractional part of a number
+  * mod(a, b)
+    a modulo b
+  * length()
+  * atan(y,x)
+  * mix(v1, v2, pct)
+    Interpolation linéaire entre v1 et v2 en fonction de 'pct'
+  * sign(float val)
+    Renvoi -1 si val est négatif, 1 si val est positif
 ==== Fonctions Processing pour transmettre des données ====
@@ Ligne 74: / Ligne 96: @@
 > Attention ! Lorsqu'on transmet des nombres entiers, comme par exemple : ''set("u_resolution", 512, 512)'', soyez sûr d'avoir déclaré les variables ''uniform'' pour des types entiers, comme : ''ivec2'', ''ivec3''... \\
 > Une autre solution est de les convertir en nombres flottants avant de les transmettre : ''set("u_resolution", float(512), float(512))''
+==== Variables uniform communes à tous les shaders dans Processing ====
+Certaines variables ''uniform'' sont définies dans Processing et sont disponibles dans tous les shaders.\\
+Elles sont déclarées dans le fichier ''PShader.java'' de Processing.
+<code glsl>
+uniform mat4 transformMatrix; // la matrice de model view projection pour transformer les coordonnées du vertex du model space au clip space
+uniform mat4 projectionMatrix; // la matrice de projection permet de passer du camera space au clip space
+uniform mat4 modelviewMatrix; // la matrice modelview permet de passer du model space au world space puis au camera space
+uniform vec2 resolution; // contient la résolution de notre fenêtre
+uniform vec4 viewport; // contient la position de notre fenêtre ainsi que sa résolution
+</code>
 ===== Textures =====
+Pour sampler un texel en GLSL (extraire la couleur d'une texture à un point donné), on utilise la fonction:
+''texture2D(sampler2D image, vec2 uv)'' \\
+Les coordonnes UV doivent être comprises entre 0.0 et 1.0 \\
+Elles pour origine le coin bas-gauche (0, 0) contrairement aux coordonnées d'écran, qui ont pour origine le coin haut-gauche.
+===== Utilisation d'un buffer hors-écran =====
+Pratique pour créer des effets avec retour d'information (feedback), comme par exemple un effet de réaction-diffusion.
+<code java>
+PGraphics buffer = createGraphics(x, y, P2D);
+buffer.beginDraw();
+buffer.shader(myShader);
+buffer.rect(0, 0, buffer.width, buffer.height);
+buffer.endDraw();
+image(buffer, 0, 0);
+</code>
 ===== Fonctions utiles =====
@@ Ligne 157: / Ligne 209: @@
             (c - a)* u.y * (1.0 - u.x) +
             (d - b) * u.x * u.y;
+}
+</code>
+== Fractional Brownian Motion ==
+<code glsl>
+float hash(vec2 coord)
+{
+    return fract(sin(dot(coord.xy, vec2(12.9898, 78.233))) * 43758.5453123);
+}
+float noise(vec2 U)
+{
+    vec2 id = floor(U);
+          U = fract(U);
+    U *= U * ( 3. - 2. * U );
+    vec2 A = vec2( hash(id), hash(id + vec2(0,1)) ),
+         B = vec2( hash(id + vec2(1,0)), hash(id + vec2(1,1)) ),
+         C = mix( A, B, U.x);
+    return mix( C.x, C.y, U.y );
+}
+/**
+    fBM stands for Fractional Brownian Motion
+    https://iquilezles.org/articles/fbm/
+    Set octave to 8 for a detailed noise
+    A value of 1.0 for H is good
+*/
+float fbm(vec2 x, float H, int octave)
+{
+    float G = exp2(-H);
+    float f = 1.0;
+    float a = 1.0;
+    float t = 0.0;
+    for( int i=0; i<octave; i++ )
+    {
+        t += a*noise(f*x);
+        f *= 2.0;
+        a *= G;
+    }
+    return t;
 }
 </code>