Heim >Web-Frontend >js-Tutorial >[WebGL] [Basis] nicht gehäutetes Modell
von der lokalen/Modellposition zur Position des endgültigen Clipbereichs
Drei Transformation Maxtrix:
Projektion: Projektionstransformationsmatrix
Transformation Koordinatensystem anzeigen in Raumkoordinatensystem ausschneiden
Ansicht: Transformationsmatrix anzeigen
Modellkoordinatensystem in Koordinatensystem anzeigen(Position der Kamera verschieben)
Modell: Modelltransformationsmatrix
lokale Koordinate in Modellkoordinatensystem/Spielweltkoordinatensystem (absolute Koordinate) umwandeln
Position: Die lokalen Koordinaten der Eckpunkte
Lokales Koordinatensystem (relatives Koordinatensystem)
Absolute(World) Y+ axis Y (0, 1, 0) | | Local(Model) Y+ axis | | / | | / | | | ---------- o (1, 0, 1) ← Local(Model) Origin ---- Local X+ axis | / | | / | | / | | / | | / | |______________________/______|__________ X (1, 0, 0) Absolute(World) X+ axis / Local(Model) Z+ axis / / / Z (0, 0, 1) Absolute(World) Z+ axis2. WebGL verwendet standardmäßig die primäre Spaltenreihenfolge, während C standardmäßig die primäre Zeilenreihenfolge verwendet.
Spalten-Hauptreihenfolge gespeichert, was sich auf die Matrixanordnung und die Berechnungsreihenfolge auswirkt. Diese Speichermethode beeinflusst, wie Matrizen in WebGL definiert und verwendet werden. Hier sind einige gängige Vorgehensweisen bei der Arbeit mit Spalten-Hauptmatrizen in WebGL:
In WebGL wird diese Matrix als eindimensionales Array in Spalten-Hauptreihenfolge dargestellt:
const matrix = [ m11, m21, m31, m41, // First column m12, m22, m32, m42, // Second column m13, m23, m33, m43, // Third column m14, m24, m34, m44 // Fourth column ];
gl.uniformMatrix4fv(location, false, matrix);Falsch bedeutet hier, dass die Matrix nicht transponiert werden soll. Da WebGL standardmäßig die Reihenfolge der Hauptspalten verwendet, stellen Sie sicher, dass das Datenformat dieser Anforderung entspricht, da die Standard-Math-Bibliothek von JavaScript möglicherweise standardmäßig die Reihenfolge der Hauptzeilen verwendet.
Die resultierende Matrix M kann als Produkt der Transformationsmatrizen T, R und S ausgedrückt werden:
M = T ⋅ R ⋅ S
In dieser Gleichung:
In der Reihenfolge der Hauptspalten wendet diese Sequenz zuerst die Skalierung, dann die Drehung und schließlich die Übersetzung an.
lass modelMatrix = mat4.create();// eine Identitätsmatrix erstellen
Absolute(World) Y+ axis Y (0, 1, 0) | | Local(Model) Y+ axis | | / | | / | | | ---------- o (1, 0, 1) ← Local(Model) Origin ---- Local X+ axis | / | | / | | / | | / | | / | |______________________/______|__________ X (1, 0, 0) Absolute(World) X+ axis / Local(Model) Z+ axis / / / Z (0, 0, 1) Absolute(World) Z+ axis
Das obige ist der detaillierte Inhalt von[WebGL] [Basis] nicht gehäutetes Modell. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!