Matrix

Beschreibung

Die Matrix-Klasse stellt eine Transformationsmatrix dar, die festlegt, wie Punkte eines Koordinatenraums einem anderen Koordinatenraum zugeordnet sind.

Sie können wie folgt verschiedene grafische Transformationen an einem Anzeigeobjekt durchführen:

  • Festlegen der Eigenschaften eines Matrix-Objekts
  • Anwenden dieses Matrix-Objekts auf die matrix-Eigenschaft eines Transform-Objekts
  • Anwenden des Transform-Objekts als transform-Eigenschaft des Anzeigeobjekts

Die verfügbaren Transformationsfunktionen sind Schieben (x- und y-Neupositionierung), Drehen und Skalieren.

Transformationsmatrizen

Diese Transformationsfunktionen werden als affine Transformationen bezeichnet. Bei affinen Transformationen bleiben Linien bei der Transformation gerade, sodass Parallelen auch parallel bleiben.

Ein Transformationsmatrixobjekt ist eine 3 x 3-Matrix mit folgendem Inhalt:

| a c tx |
| b d ty |
| u v w  |

In herkömmlichen Transformationsmatrizen werden zusätzliche Funktionen über die Eigenschaften u, v und w bereitgestellt. Die Matrix-Klasse bezieht sich nur auf den zweidimensionalen Raum. Entsprechend wird immer davon ausgegangen, dass die Eigenschaftswerte u und v 0,0 betragen und dass der Eigenschaftswert w 1,0 beträgt. Die effektiven Werte der Matrix lauten wie folgt:

| a c tx |
| b d ty |
| 0 0 1  |

Syntax

new flwebgl.geom.Matrix(values)

Parameter

Name Typ Beschreibung
values Zahl[] (optional) Ein Array, das die Werte der Matrix im Format [a b c d tx ty] definiert. Wenn nicht angegeben, ist die Matrix auf Identität eingestellt.

Methoden

clone()

Beschreibung

    Diese Methode gibt einen Klon der Matrix-Instanz zurück

Rückgabewerte

  • Ein Klon der Matrix-Instanz.
  • Typ - Matrix  

concat(matrix)

Beschreibung

    Diese Methode verkettet eine bereitgestellte Matrix mit der aktuellen Matrix und kombiniert auf diese Weise die geometrischen Effekte der beiden Matrizen.

Parameter

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix  

Beispiel

In diesem Beispiel wird das Drehen und Skalieren einer Matrix verkettet.

 
Name Typ Beschreibung
matrix Matrix
Die zu multiplizierende Matrix
var m1 = new flwebgl.geom.Matrix();
m1.rotate(45 * Math.PI / 180);

var m2 = new flwebgl.geom.Matrix();
m2.scale(2, 2);

m1.concat(m2);

copy(matrix)

Beschreibung

    Diese Methode kopiert die angegebene Matrix in diese Matrix.

Parameter

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix  
Name Typ Beschreibung
matrix Matrix Die Matrix, aus der Eigenschaften kopiert werden sollen

equals(mat)

Beschreibung

    Diese Methode prüft, ob die angegebene Matrix dieselben Werte aufweist wie diese Instanz.

Parameter

Rückgabewerte

  • Typ - Boolescher Wert
Name Typ Beschreibung
mat Matrix Die zu vergleichende Matrix

getValues()

Beschreibung

    Diese Methode gibt die Werte der Elemente in der Matrix zurück.

Rückgabewerte

  • Ein Array das die Werte der Matrix im Format [a b c d tx ty] definiert.
  • Typ - Zahl[]

Beispiel

In diesem Beispiel werden die Werte einer Matrix ermittelt und so angepasst, dass sie um den Faktor 0,5 geneigt wird.

var m = new flwebgl.geom.Matrix();
var arr = m.getValues();
arr[1] = 0.5;
m.setValues(arr);

Identität()

Beschreibung

    Diese Methode definiert die Matrix als Identitätsmatrix.

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix

Umkehren()

Beschreibung

    Diese Methode invertiert die Matrix. Bei der invertierten Matrix handelt es sich um die umgekehrte Transformation.

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix

isIdentity()

Beschreibung

    Diese Methode gibt „true“ aus, wenn es sich bei der Matrix um eine Identitätsmatrix handelt.

Rückgabewerte

  • Typ - Boolescher Wert

rotate(angle)

Beschreibung

    Diese Methode wendet eine Drehung auf die Matrix an.

Parameter

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix

Beispiel

Dieses Beispiel erstellt eine neue Matrix-Instanz, die für die Identitätsmatrix gestartet wird und diese um 45 Grad dreht.

Name Typ Beschreibung
angle Zahl Der Winkel im Bogenmaß. Um Gradzahlen zu verwenden, multiplizieren Sie mit Math.PI/180.
var m = new flwebgl.geom.Matrix();
m.rotate(45 * Math.PI / 180);

scale(x, y)

Beschreibung

    Diese Methode wendet eine Skalierung auf die Matrix an.

Parameter

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix

Beispiel

In diesem Beispiel wird eine neue Matrix-Instanz erstellt, die zur Identifizierung der Matrix gestartet wird und sie mit einem Faktor von 2 sowohl horizontal als auch vertikal skaliert.

Name Typ Beschreibung
x Zahl Der horizontale Skalierungsfaktor.
y Zahl Der vertikale Skalierungsfaktor.
var m = new flwebgl.geom.Matrix();
m.scale(2, 2);

setValues(values)

Beschreibung

    Diese Methode legt die Werte der Elemente in der Matrix fest.

Parameter

Beispiel

Siehe Beispiel unter der Funktion getValues().

Name Typ Beschreibung
values
Zahl[] Ein Array das die Werte der Matrix im Format [a b c d tx ty] definiert.

transformPoint(point)

Beschreibung

    Diese Methode transformiert einen Punkt entsprechend dieser Matrix.

Parameter

Rückgabewerte

  • Der transformierte Punkt.
  • Typ - Punkt
Name Typ Beschreibung
point Point Der zu transformierende Punkt.

transformRect(rect)

Beschreibung

    Diese Methode transformiert alle vier Punkte des Rechtecks entsprechend dieser Matrix.

Parameter

Rückgabewerte

  • Das transformierte Rechteck.
  • Typ - Rechteck
Name Typ Beschreibung
rect Rect
Das zu transformierende Rechteck.

translate(dx, dy)

Beschreibung

    Diese Methode übersetzt die Matrix für die x- und y-Achse.

Parameter

Rückgabewerte

  • Diese Matrix. Nützlich zum Verketten von Methodenaufrufen.
  • Typ - Matrix
Name Typ Beschreibung
dx Zahl Die Verschiebung entlang der x -Achse nach rechts.
dy Zahl Die Verschiebung entlang der y -Achse nach unten.

 Adobe

Schneller und einfacher Hilfe erhalten

Neuer Benutzer?

Adobe MAX 2024

Adobe MAX
Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online

Adobe MAX

Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online

Adobe MAX 2024

Adobe MAX
Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online

Adobe MAX

Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online