Partage de technologie

Graphiques 3D en temps réel avec WebGL2

2024-07-08

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Pipeline de rendu WebGL

La figure suivante est un diagramme schématique du pipeline de rendu WebGL :

Objets tampons de vertex (VBO)

VBOS contient des informations utilisées pour décrire la géométrie. Par exemple, les coordonnées des sommets, les coordonnées normales, la couleur, les coordonnées de texture, etc. de la géométrie.

Objets tampons d'index (IBO)

Les IBO contiennent des informations décrivant les relations entre les sommets. Il utilise la position d'index du sommet dans les VBO.

Shader de sommet

Le vertex shader est exécuté sur chaque sommet. Il gère les informations relatives aux sommets telles que les coordonnées des sommets, les coordonnées normales, les coordonnées de couleur et de texture. Ces informations sont obtenues du VBO et associées à l'attribut utilisé dans le vertex shader.

Shader de fragments

Le fragment shader est exécuté sur chaque fragment pour calculer la couleur de chaque fragment.

Mémoire tampon d'image

Le frame buffer est un tampon bidimensionnel utilisé pour stocker les fragments traités dans le fragment shader. Une fois tous les fragments traités, les résultats du rendu peuvent être affichés à l'écran.

Les attributs

Les propriétés sont des variables d'entrée dans le vertex shader. Il spécifie comment lire les données du tampon et transmettre les données au vertex shader. Vous pouvez stocker des informations de position (trois données à virgule flottante de 32 bits) dans le tampon. Spécifiez ensuite à partir de quel tampon lire les informations de position, quel est le type de données des informations de position, à quelle position dans le tampon commencer la lecture et combien d'octets lire au total. Étant donné que le vertex shader doit être exécuté sur chaque sommet, les valeurs des attributs ne seront pas les mêmes à chaque exécution.

Uniformes

Les uniformes sont des variables d'entrée dans les vertex shaders et les fragment shaders. Contrairement aux attributs, les variables Uniformes sont fixées dans une boucle de rendu. Par exemple, la position de la source lumineuse.

Textures

Les textures contiennent souvent des données d'image, mais peuvent contenir d'autres données.

Variations

Les variables variables sont souvent utilisées pour transmettre des données du vertex shader au fragment shader. Les variables Varyings du vertex shader sont interpolées avant d'être transmises au fragment shader.