@@ -8,13 +8,13 @@ commencé avec les fondamentaux](webgl-fundamentals.html) et le précédent
88concernait [ animation] ( webgl-animation.html ) .
99
1010Comment appliquons-nous les textures en WebGL ? Vous pourriez probablement
11- déduire comment par lire [ les articles sur le traitement
11+ déduire comment si vous avez lu [ les articles sur le traitement
1212d'image] ( webgl-image-processing.html ) mais ce sera probablement plus facile à
1313comprendre si nous l'examinons plus en détail détail.
1414
1515La première chose que nous devons faire est d'ajuster nos shaders pour utiliser
16- des textures. Ici sont les modifications apportées au vertex shader. Il faut
17- passer en texture coordonnées. Dans ce cas , nous les transmettons directement au
16+ des textures. Voici les modifications apportées au vertex shader, il faut lui
17+ passer les coordonnées de la texture. Ensuite , nous les transmettrons directement au
1818fragment shader.
1919
2020 attribute vec4 a_position;
@@ -115,7 +115,7 @@ seulement commencer à dessiner. L'autre solution consiste à créer une texture
115115à utiliser jusqu'à ce que l'image soit téléchargée. De cette façon, nous pouvons
116116commencer le rendu immédiatement. Ensuite, une fois que l'image a été
117117téléchargé, nous copions l'image dans la texture. Nous utiliserons cette méthode
118- dessous.
118+ ci- dessous.
119119
120120 *// Create a texture.
121121 *var texture = gl.createTexture();
@@ -135,13 +135,13 @@ dessous.
135135 * gl.generateMipmap(gl.TEXTURE_2D);
136136 *});
137137
138- Et le voici
138+ Et voilà
139139
140140{{{example url="../webgl-3d-textures.html" }}}
141141
142142Et si nous voulions simplement utiliser une partie de la texture sur le devant
143143du « F » ? Les textures sont référencées avec des "coordonnées de texture" et les
144- coordonnées de texture vont de 0.0 à 1.0 de gauche à sur toute la texture, et de
144+ coordonnées de texture vont de 0.0 à 1.0 de gauche à la largeur de la texture, et de
1451450,0 à 1,0 du premier pixel de la première ligne au dernier pixel de la dernière
146146ligne. Remarquez que je n'ai pas dit en haut ou en bas. Le haut et le bas
147147n'ont aucun sens dans l'espace de texture parce que jusqu'à ce que vous
@@ -231,8 +231,8 @@ Imaginez que nous ayons une texture de 16x16 pixels.
231231
232232<img class =" webgl_center " src =" resources/mip-low-res-enlarged.png " style =" border : 2px solid black ;" />
233233
234- Imaginez maintenant que nous avons essayé de dessiner cette texture sur un
235- polygone de 2x2 pixels de large sur l'écran. De quelles couleurs doit-on faire
234+ Imaginez maintenant que nous ayons essayé de dessiner cette texture sur un
235+ polygone de 2x2 pixels de large sur l'écran. De quelles couleurs seront
236236ces 4 pixels ? Il y a 256 pixels au choix. Dans Photoshop, si vous avez mis à
237237l'échelle une image de 16x16 pixels en 2x2 pixels, il fera la moyenne des 8x8
238238pixels de chaque côté de l'image pour calculer les 4 pixels de l'image 2x2.
@@ -321,7 +321,7 @@ effet. Par exemple, si vous voulez que quelque chose ait un effet *rétro* pixé
321321peut-être que vous utiliserez ` NEAREST ` . Les mips prennent
322322également de la mémoire. En fait ils prennent 33% de mémoire en plus. Cela peut
323323être beaucoup de mémoire, surtout pour un très grande texture comme vous
324- pourriez l'utiliser sur un écran de titre d'un jeu. Si tu n'allez jamais
324+ pourriez l'utiliser sur un écran de titre d'un jeu. Si vous n'allez jamais
325325dessiner quelque chose de plus petit que le plus grand mip pourquoi gaspiller
326326de la mémoire pour ces mips. Au lieu de cela, utilisez simplement ` NEAREST ` ou
327327` LINEAR ` car ils n'utilisent que le premier mip.
@@ -516,7 +516,7 @@ divisions en plans.
516516A few other very important things you might want to know about textures.
517517One is [ how texture unit state works] ( webgl-texture-units.html ) .
518518One is [ how to use 2 or more textures at once] ( webgl-2-textures.html ) . Another
519- is [ how to use images from other domains] ( webgl-cors-permission.html ) . And
519+ is [ how to use images from other domains] ( webgl-cors-permission.html ) . And
520520one more is [ perspective correct texture mapping] ( webgl-3d-perspective-correct-texturemapping.html ) which in some ways
521521is trivia but it's good to know.
522522Quelques autres choses très importantes que vous voudriez peut-être savoir sur
0 commit comments