If you're seeing this message, it means we're having trouble loading external resources on our website.

Si vous avez un filtre web, veuillez vous assurer que les domaines *. kastatic.org et *. kasandbox.org sont autorisés.

Contenu principal

Le bruit en deux dimensions

Cette aperçu des valeurs de bruit dans un espace à une dimension est important car il va nous faciliter l'appréhension d'un espace à deux dimensions. Réfléchissons-y un instant. Dans un espace à une dimension, on a une séquence de valeurs qui sont toutes, proches de leurs voisines. Elles en ont deux : une valeur qui arrive avant (à gauche dans le graphique) et une autre qui arrive après (à droite dans le graphique).
Image de Nature of Code
Figure I.10 : bruit en 1D
Les bruit à deux dimensions fonctionnent conceptuellement exactement de la même façon. La différence, évidemment, est que nous ne regardons pas des valeurs le long d'un chemin linéaire, mais des valeurs sur une grille. Imaginez un morceau de papier quadrillé avec des nombres écrits dans chaque carreau. Une valeur donnée sera proche de l'ensemble de ses voisines : au-dessus, en dessous, à droite, à gauche et sur les diagonales.
Image de Nature of Code
Figure I.11 : bruit en 2D
Si vous visualisez ce papier quadrillé, avec des valeurs mappées sur l'intervalle complet de luminosité d'une couleur, vous obtiendrez quelque chose qui ressemble à des nuages. Le blanc est situé près du gris clair, qui est situé près du gris, qui est situé près du gris foncé, qui est situé près du noir, qui est situé près du gris foncé, etc...
Image de Nature of Code
C'est la raison pour laquelle le bruit a été inventé, à l'origine. On règle un peu les paramètres. On joue avec la couleur. Et on obtient une image qui ressemble à du marbre, du bois, ou toute autre texture organique.
Regardons rapidement comment implémenter un bruit en deux dimensions en ProcessingJS. Si on veut colorier chaque pixel de la fenêtre aléatoirement, il faut une boucle imbriquée, pour accéder à chaque pixel, afin de lui attribuer une luminosité aléatoire.
Pour colorier chaque pixel en utilisant la fonction noise(), nous ferons exactement la même chose, mais au lieu de random(), on appellera noise().
var bright = map(noise(x,y), 0, 1, 0, 255);
C'est un très bon point de départ. Cela nous donne une valeur de bruit pour chaque coordonnée (x, y) de notre espace en deux dimensions. Le problème est que nous n'obtenons pas la qualité nuageuse que nous souhaitons. Sauter du pixel 200 au pixel 201 est un déplacement trop important quand il s'agit de bruit. Rappelez-vous, quand nous travaillions sur du bruit à une dimension, nous incrémentions notre variable de temps de 0,01 à chaque passage, pas de 1 ! Une solution élégante à ce problème est de passer des variables différentes, en arguments à la fonction noise. Par exemple, nous pouvons incrémenter une variable appelée xoff à chaque fois que nous nous déplaçons horizontalement, et une variable yoff à chaque fois que nous nous déplaçons verticalement, dans la boucle imbriquée.
Nous avons vu plusieurs utilisations classiques du bruit de Perlin dans ce tutoriel. Avec le bruit unidimensionnel, nous avons utilisé des valeurs harmonieuses pour modifier la trajectoire d'un objet qui se déplace, cela suggère une sorte d'errance. Avec le bruit à deux dimensions, nous avons créé un modèle de nuages avec des valeurs harmonieuses sur un plan, constitué de pixels. Il est important de se rappeler que les valeurs de bruit de Perlin ne sont que cela : des valeurs. Elles ne sont pas directement des localisation de pixels ou des trajectoires ou des couleurs. Tous les exemples de nos didacticiels qui contiennent une variable pourraient être contrôlés via le bruit de Perlin. Par exemple, lorsque nous modélisons la force du vent, cette force pourrait être contrôlée par le bruit de Perlin. Idem pour les angles entre les branches, dans un modèle d'arbre fractal, ou pour la vitesse et la direction d'objets se déplaçant le long d'une grille dans une simulation de champ de flux, comme dans l'animation ci-dessous.
Nous avons débuté le précédent module en parlant du hasard comme d'une béquille. À bien des égards, c'est la réponse la plus évidente aux questions que nous nous posons continuellement (comment cet objet doit se déplacer ? de quelle couleur doit-il être ?). Cette réponse évidente, cependant, peut aussi s'avérer être celle de la facilité.
Alors que nous terminons ce module, il est utile de s'apercevoir que nous pourrions aisément tomber dans le piège qui consiste à utiliser aussi le bruit de Perlin comme d'une béquille. Comment cet objet doit-il se déplacer ? Bruit de Perlin ! De quelle couleur doit-il être ? Bruit de Perlin ! À quelle vitesse doit-il croître ? Bruit de Perlin !
La finalité sur tout cela n'est pas de dire qu'on doit, ou ne doit pas, utiliser le hasard. Ou qu'on doit, ou ne doit pas, utiliser le bruit de Perlin. La finalité, c'est que c'est vous qui définissez les règles de votre système, et plus connaîtrez d'outils, plus vous aurez de choix à disposition pour implémenter ces règles. L'objectif de ces explications est de vous aider à remplir votre boîte à outils. Si vous ne connaissez qu'un seul type de hasard, alors toutes vos conceptions n'incluront qu'un seul type de hasard. Le bruit de Perlin est un outil supplémentaire pour le hasard, que vous pouvez utiliser dans vos programmes. Après un peu de pratique avec le bruit de Perlin, nous allons aborder un autre type d'outils : les vecteurs !

Ce cours sur les "simulations de phénomènes naturels" est dérivé de l'ouvrage "The Nature of Code" de Daniel Shiffman, utilisé sous licence Creative Commons Attribution-NonCommercial 3.0 Unported License.

Vous souhaitez rejoindre la discussion ?

Vous comprenez l'anglais ? Cliquez ici pour participer à d'autres discussions sur Khan Academy en anglais.