Descrizione
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:
- Impostate le proprietà di un oggetto Matrix.
- Applicate l’oggetto Matrix alla proprietà matrix di un oggetto Transform.
- Applicate l’oggetto Transform alla proprietà transform dell’oggetto di visualizzazione.
Queste funzioni di trasformazione includono traslazione (riposizionamento di x e y), rotazione, modifica in scala.
Matrix di trasformazione
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 |
Sintassi
new flwebgl.geom.Matrix(values)
Parametri
| 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. |
Metodi
clone()
Descrizione
Questo metodo restituisce un clone dell’istanza Matrix.
Restituisce
- Un clone dell’istanza Matrix.
- Tipo - Matrix
concat(matrix)
Descrizione
Questo metodo concatena la matrice fornita con la matrice corrente, combinando gli effetti geometrici delle due matrici.
Parametri
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
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);
copy(matrix)
Descrizione
Questo metodo copia la matrice specificata su questa matrice.
Parametri
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
| Nome | Tipo | Descrizione |
|---|---|---|
| matrix | Matrix | La matrice da cui copiare le proprietà |
equals(mat)
Descrizione
Questo metodo controlla se la matrice data ha gli stessi valori di questa istanza.
Parametri
Restituisce
- Tipo - booleano
| Nome | Tipo | Descrizione |
|---|---|---|
| mat | Matrix | La matrice da confrontare |
getValues()
Descrizione
Questo metodo restituisce valori degli elementi nella matrice.
Restituisce
- Un array che definisce i valori della matrice in formato [a b c d tx ty]
- Tipo - numero[]
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);
identity()
Descrizione
Questo metodo imposta la matrice su una matrice Identity.
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
invert()
Descrizione
Questo metodo inverte la matrice in modo da applicare la trasformazione opposta.
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
isIdentity()
Descrizione
Questo metodo indica “true” se la matrice è una matrice Identity.
Restituisce
- Tipo - booleano
rotate(angle)
Descrizione
Questo metodo applica una trasformazione di rotazione all'oggetto Matrix.
Parametri
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
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);
scale(x, y)
Descrizione
Questo metodo applica una trasformazione di ridimensionamento in scala all'oggetto Matrix.
Parametri
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
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);
setValues(values)
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] |
transformPoint(point)
Descrizione
Questo metodo trasforma un punto in base a questa matrice.
Parametri
Restituisce
- Il punto trasformato.
- Tipo - Point
| Nome | Tipo | Descrizione |
|---|---|---|
| point | Point | Il punto da trasformare. |
transformRect(rect)
Descrizione
Questo metodo trasforma tutti e quattro i punti dell’oggetto Rect in base a questa matrice.
Parametri
Restituisce
- L’oggetto Rect trasformato.
- Tipo - Rect
| Nome | Tipo | Descrizione |
|---|---|---|
| rect | Rect | L’oggetto Rect da trasformare. |
translate(dx, dy)
Descrizione
Questo metodo effettua la traslazione della matrice lungo gli assi x e y.
Parametri
Restituisce
- La matrice corrente. Utile per concatenare chiamate di metodo.
- Tipo - Matrix
| 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