La classe Matrix rappresenta una matrice di trasformazione che determina come mappare i punti da uno spazio di coordinate a un altro.
È possibile eseguire diverse trasformazioni grafiche su un oggetto di visualizzazione, come segue:
Queste funzioni di trasformazione includono traslazione (riposizionamento di x e y), rotazione, modifica in scala.
Questi tipi di trasformazioni sono noti collettivamente come trasformazioni affini. Poiché le trasformazioni affini mantengono la rettilineità delle linee durante la trasformazione, le linee parallele rimangono tali.
Un oggetto matrice di trasformazione è una matrice 3 x 3 con il contenuto seguente:
| a c tx | | b d ty | | u v w |
Nelle matrici di trasformazione tradizionali, le proprietà u, v e w offrono funzioni supplementari. La classe Matrix funziona solo nello spazio bidimensionale. Pertanto, i valori delle proprietà u e v sono sempre 0.0 e il valore della proprietà w è sempre 1.0. I valori effettivi della matrice sono i seguenti:
| a c tx | | b d ty | | 0 0 1 |
new flwebgl.geom.Matrix(values)
Nome | Tipo | Descrizione |
---|---|---|
values | numero[] | (Opzionale) Un array che definisce i valori della matrice in formato [a b c d tx ty]. Se non specificato, la matrice viene impostata su identity. |
Descrizione
Questo metodo restituisce un clone dell’istanza Matrix.
Restituisce
Descrizione
Questo metodo concatena la matrice fornita con la matrice corrente, combinando gli effetti geometrici delle due matrici.
Parametri
Restituisce
Esempio
Questo esempio concatena una matrice di rotazione e una matrice di ridimensionamento in scala.
Nome | Tipo | Descrizione |
---|---|---|
matrix | Matrix | La matrice da moltiplicare |
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);
Descrizione
Questo metodo copia la matrice specificata su questa matrice.
Parametri
Restituisce
Nome | Tipo | Descrizione |
---|---|---|
matrix | Matrix | La matrice da cui copiare le proprietà |
Descrizione
Questo metodo controlla se la matrice data ha gli stessi valori di questa istanza.
Parametri
Restituisce
Nome | Tipo | Descrizione |
---|---|---|
mat | Matrix | La matrice da confrontare |
Descrizione
Questo metodo restituisce valori degli elementi nella matrice.
Restituisce
Esempio
In questo esempio vengono ottenuti i valori di una matrice e viene quindi applicata un’inclinazione con fattore 0,5.
var m = new flwebgl.geom.Matrix(); var arr = m.getValues(); arr[1] = 0.5; m.setValues(arr);
Descrizione
Questo metodo imposta la matrice su una matrice Identity.
Restituisce
Descrizione
Questo metodo inverte la matrice in modo da applicare la trasformazione opposta.
Restituisce
Descrizione
Questo metodo indica “true” se la matrice è una matrice Identity.
Restituisce
Descrizione
Questo metodo applica una trasformazione di rotazione all'oggetto Matrix.
Parametri
Restituisce
Esempio
Questo esempio crea una nuova istanza Matrix inizializzata sulla matrice Identity e la ruota di 45 gradi.
Nome | Tipo | Descrizione |
---|---|---|
angle | numero | L’angolo di rotazione in radianti. Per utilizzare i gradi, moltiplicate per Math.PI/180. |
var m = new flwebgl.geom.Matrix(); m.rotate(45 * Math.PI / 180);
Descrizione
Questo metodo applica una trasformazione di ridimensionamento in scala all'oggetto Matrix.
Parametri
Restituisce
Esempio
Questo esempio crea una nuova istanza Matrix inizializzata sulla matrice Identity e la ridimensiona in scala di un fattore di 2 in orizzontale e in verticale.
Nome | Tipo | Descrizione |
---|---|---|
x | numero | Il fattore di scala orizzontale. |
y | numero | Il fattore di scala verticale. |
var m = new flwebgl.geom.Matrix(); m.scale(2, 2);
Descrizione
Questo metodo imposta i valori degli elementi nella matrice.
Parametri
Esempio
Vedete l’esempio riportato per la funzione getValues().
Nome | Tipo | Descrizione |
---|---|---|
values | numero[] | Un array che definisce i valori della matrice in formato [a b c d tx ty] |
Descrizione
Questo metodo trasforma un punto in base a questa matrice.
Parametri
Restituisce
Nome | Tipo | Descrizione |
---|---|---|
point | Point | Il punto da trasformare. |
Descrizione
Questo metodo trasforma tutti e quattro i punti dell’oggetto Rect in base a questa matrice.
Parametri
Restituisce
Nome | Tipo | Descrizione |
---|---|---|
rect | Rect | L’oggetto Rect da trasformare. |
Descrizione
Questo metodo effettua la traslazione della matrice lungo gli assi x e y.
Parametri
Restituisce
Nome | Tipo | Descrizione |
---|---|---|
dx | numero | La quantità di spostamento a destra lungo l'asse x. |
dy | numero | La quantità di spostamento in basso lungo l'asse y. |
Accedi al tuo account