¿Cómo consulta webgl la información del modelo? ¿Qué debo hacer?

1. Escena

La escena, como su nombre lo indica, es un contenedor que muestra objetos en un espacio tridimensional, al igual que una caja es un espacio tridimensional. escena dimensional.

2. Sistema de coordenadas:

WEBGL utiliza el sistema de coordenadas cartesiano (ancho, alto y profundidad), pudiendo también especificar el uso de otros sistemas de coordenadas.

WEBGL tiene algunas diferencias con el sistema de coordenadas flash3D que he usado en el pasado. En flash3d, la esquina superior izquierda de la pantalla es el origen del sistema de coordenadas, hacia abajo está la dirección positiva del eje Y y hacia la derecha está la dirección positiva del eje X, mientras que en webgl, el centro de la pantalla es el origen.

Pero hay un tercer eje en el mundo 3D, el eje Z, que representa la profundidad de la escena.

En el mundo Webgl, podemos usar la regla de la mano izquierda para ayudarnos a recordar las direcciones positivas de los tres ejes. Estire la mano izquierda, con el dedo índice recto y horizontal, el dedo medio apuntando verticalmente hacia abajo, el pulgar apuntando hacia usted y los otros dedos retraídos. Luego, el dedo índice apunta en la dirección positiva del eje X, el medio. el dedo apunta en la dirección positiva del eje Y y el pulgar apunta en la dirección positiva del eje Z.

3. El concepto de proyección:

El espacio tridimensional que vemos en la pantalla no es un espacio tridimensional real, sino un espacio tridimensional simulado mediante algoritmos matemáticos. proyectada en la pantalla. Es solo una imagen bidimensional. La proyección es el proceso de mapear objetos en un espacio tridimensional simulado en una pantalla para generar una imagen bidimensional. La proyección se divide en proyección ortográfica y proyección en perspectiva, que es como la implementa la cámara.

4. Cámara:

La cámara es el observador en la escena. La imagen que la gente ve a través de la pantalla es en realidad la imagen del objeto espacial tridimensional asignado a la cámara. Es muy probable que esta imagen esté incompleta, solo el rango actualmente visible para la cámara. Esto depende del tipo de cámara.

Hay dos tipos en three.js, cámaras ortográficas y cámaras de perspectiva.

El campo de visión de una cámara ortográfica es como un cubo. Los objetos del cubo se proyectarán a lo largo de los bordes del cubo a cada lado del cubo, con el mismo tamaño que los objetos del cubo. , por lo que al usar la cámara ortográfica no hay forma de saber qué tan lejos está un objeto de la pantalla. Este tipo de cámara se utiliza principalmente para dibujar gráficos bidimensionales en un espacio tridimensional, como equipos de examen médico, y no la usaremos.

Cámara transparente

Una cámara de perspectiva es como una pirámide con una parte superior aplanada. La superficie aplanada en la parte superior de la pirámide puede entenderse como nuestra pantalla y los objetos dentro de la pirámide. están a lo largo de la dirección longitudinal de la pirámide proyectadas hacia la cima, suponiendo que hay dos objetos del mismo tamaño y forma ubicados a diferentes alturas dentro de la pirámide, los tamaños de las sombras que proyectan hacia la cima serán diferentes. Vista en perspectiva de la cámara en perspectiva. Usando una cámara de perspectiva, podemos distinguir fácilmente la distancia de los objetos en un espacio plano tridimensional. Ahora voltea la pirámide y apunta la parte superior plana hacia tu ojo, para que sea fácil entender cómo la computadora representa el objeto en una cámara en perspectiva.

5. Renderizado:

El renderizado es el proceso de ejecutar código para dibujar gráficos en la pantalla. El renderizado se realiza en tiempo real, como reproducir una película, y consta de muchos fotogramas consecutivos, donde un fotograma actúa como un fotograma instantáneo de la película.

6. Puntos y vectores

Un punto consta de tres valores: x, y y z. Cada punto puede representar una posición única en el espacio tridimensional. Un vector, también llamado vector tridimensional, puede entenderse como un segmento de línea que apunta al centro de la escena. Sabemos que un punto tiene tres valores, por lo que el vector se llama vector unitario o escalar, que solo representa el. dirección del vector. Solo representa la dirección del vector, no la longitud del vector. Ahora agregamos un valor a un escalar, y el cuarto valor representa la longitud del vector, de modo que tenemos la longitud y la dirección del vector. El vector es Se llama vector de cuatro dimensiones.

7. Caras, vértices y triángulos:

Sabemos que para determinar un plano único se necesitan al menos tres puntos, y estos tres puntos están conectados por una línea para formar For. En un plano triangular, a estos tres puntos los llamamos vértices, y los vértices son las partes que sobresalen de la figura.

8. Modelo de malla:

Los objetos de cualquier forma en el espacio tridimensional se denominan modelos, ya sea un modelo tridimensional o un modelo plano, consta de al menos. tres vértices. Estos vértices están representados por Las líneas están conectadas para formar un modelo. También es importante saber que en los gráficos por computadora actuales, todos los modelos, independientemente de su complejidad, están formados por múltiples triángulos. Nuestra esfera común, que parece redonda y lisa, en realidad está formada por muchos triángulos. Debido a su alta densidad, es difícil detectar los vértices de sus bordes a simple vista.

Dado que estos modelos están conectados con líneas y parecen una red de pesca retorcida en varias formas, llamamos a este modelo sin materiales modelo de malla (parece hueco).

9. Mapas de textura y materiales

La textura es un gráfico plano que se puede rellenar con colores sólidos o mapas de bits.

Los materiales son objetos que utilizan texturas para construir el entorno del código. Aplicamos objetos materiales a la malla del modelo para hacerlo más realista y lograr el efecto deseado.

Una forma más sencilla de entenderlo es: la textura es como un gran árbol y el material es como una tabla de madera hecha de este gran árbol. Podemos clavar la tabla de madera al objeto de malla cúbica, entonces. hay una caja de madera. |

| 0 0 0 1 |p>

Cada columna representa un vector de cuatro dimensiones. Arriba, creamos una matriz de 4X4 y en webgl normalmente usamos matrices de 4X4 y 3X3.

Transformar un modelo es el proceso de utilizar matrices para cambiar el tamaño, desplazamiento, rotación, etc. del modelo. Por lo general, multiplicamos la matriz incorporada del modelo con la matriz de transformación para obtener el modelo transformado. Por lo general, multiplicamos la matriz incorporada del modelo con la matriz de transformación para obtener una nueva matriz de transformación y la asignamos al modelo. Cada modelo tendrá su propia matriz de modelo después de su creación. No necesitamos prestar atención a cómo se genera la matriz del modelo. Solo necesitamos saber que para transformar el modelo, necesitamos multiplicar la matriz del modelo y la matriz de transformación. Aquí no se describirá específicamente cómo operar la matriz para consultar información relevante usted mismo.

11. Transformación de vista

La transformación de vista no ajusta los parámetros del modelo en sí, sino que controla directamente el movimiento de cambio visual de la cámara y la escena. dirección de la cámara del modelo, sentiremos que el modelo se hace más grande gradualmente, nos alejaremos gradualmente del origen de la escena y sentiremos que el modelo se aleja gradualmente de nosotros.

13. Lenguaje de sombreado

1) Vertex shader: Vertex shader se utiliza para controlar la iluminación, el color, el desplazamiento, etc. Si tuviéramos que representar una forma tridimensional, el sombreador de vértices se ejecutaría tres veces, una para cada vértice. Tenga en cuenta que todavía no hemos visto el dibujo en la pantalla al ejecutar el sombreador de vértices. El sombreador de vértices se preparará para el proceso de rasterización posterior. Proporcionará los recursos necesarios para la operación de rasterización. proceso.

2) Sombreador de fragmentos: para comprender el sombreador de fragmentos, primero debe comprender el significado de rasterización es el proceso de dibujar píxeles entre cada dos vértices y formar un segmento de línea. Queremos dibujar una valla y vamos a dibujarla una por una.

El sombreador de segmentos es un lenguaje que le dice a la GPU cómo rasterizar. Como su nombre indica, presenta iluminación, textura, desplazamiento, etc. píxel a píxel a lo largo de los segmentos de línea entre los vértices.

14. Introducción a three.js, la biblioteca js más popular en webgl:

Primero, la capa más externa es la escena. La escena puede contener una o más cámaras. También incluye modelos, partículas, etc.

En los objetos Object3D también se pueden incluir modelos, partículas, etc.

El proceso de creación de un modelo es:

1) Crear los vértices requeridos para el modelo

2) Crear un objeto de geometría y pasar los vértices al objeto de geometría.

3) Crea un objeto de textura, que es el material del modelo.

4) Cree un objeto de malla y pase el objeto de geometría y el objeto de textura al objeto de malla.

5) Agregue la cuadrícula a un contenedor que pueda contener objetos de cuadrícula, como escenas, Object3D, etc.

Términos comunes:

1. Escena: escena

2. Posición: Posición:

3. : Proyector

4. Ortográfico: Ortográfico: Ortográfico: Ortográfico

5. Perspectiva: Perspectiva: Cámara

7. . Renderizar: Renderizar:

8. Vector: Vector: Vector

9. Vector 3D: Vector3

10. >

11. Matriz: Matriz: Matriz: Matriz

12. Matriz de 3 filas y 3 columnas: Matriz3

13. /p>

14. Vértice: Vértice: Vértice

15. Forma plural de vértice: Vértices (vértice)

16. )

17. Textura: Textura

18. Material:

19. Cuadrícula:

20. p>

21.