Descripción
La clase Matrix representa una matriz de transformación que determina cómo asignar puntos de un espacio de coordenadas a otro.
Puede realizar varias transformaciones gráficas en un objeto de visualización como se indica a continuación:
- Defina las propiedades de un objeto Matrix
- Aplique ese objeto Matrix a la propiedad Matrix de un objeto de transformación
- Aplique el objeto de transformación como la propiedad de transformación del objeto de visualización.
Estas funciones de transformación incluyen la traslación (cambio de posición x e y), la rotación y el cambio de escala.
Matrices de transformación
En su conjunto estas transformaciones se conocen como transformaciones afines. Las transformaciones afines preservan la rectilineidad de las líneas durante la transformación, de este modo las paralelas siguen siendo paralelas.
Un objeto de matriz de transformación es una matriz de 3x3 con el contenido siguiente:
| a c tx | | b d ty | | u v w |
En las matrices de transformación tradicionales, las propiedades u, v y w ofrecen capacidades adicionales. La clase Matrix solo funciona en un espacio bidimensional. Siempre asume que los valores de propiedad u y v son 0.0, y que el valor de propiedad w es 1.0. Los valores efectivos de la matriz son los siguientes:
| a c tx | | b d ty | | 0 0 1 |
Sintaxis
new flwebgl.geom.Matrix(values)
Parámetros
Nombre | Tipo | Descripción |
---|---|---|
values | número[] | (opcional) Un conjunto que define los valores de la matriz en un formato [a b c d tx ty]. Si no se especifica, la matriz se establece en el tipo Identity. |
Métodos
clone()
Descripción
Este método devuelve una copia de la instancia de Matrix.
Valor devuelto
- Una copia de la instancia de Matrix
- Tipo: Matrix
concat(matrix)
Descripción
Este método concatena la matriz proporcionada con la matriz actual, es decir, combina los efectos geométricos de ambas matrices.
Parámetros
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
Ejemplo
Este ejemplo concatena una matriz giratoria y una matriz de escala.
Nombre | Tipo | Descripción |
---|---|---|
matrix | Matrix | La matriz que se va a multiplicar |
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)
Descripción
Este método copia la matriz especificada en esta matriz.
Parámetros
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
Nombre | Tipo | Descripción |
---|---|---|
matrix | Matrix | La matriz desde la que se copiarán propiedades |
equals(mat)
Descripción
Este método comprueba si la matriz especificada contiene los mismos valores que esta instancia.
Parámetros
Valor devuelto
- Tipo: booleano
Nombre | Tipo | Descripción |
---|---|---|
mat | Matrix | La matriz que se va a comparar |
getValues()
Descripción
Este método devuelve los valores de los elementos de la matriz.
Valor devuelto
- Un conjunto que define los valores de la matriz en un formato [a b c d tx ty].
- Tipo: número[]
Ejemplo
Este ejemplo obtiene los valores de una matriz y los modifica para sesgarlos en un factor de 0,5.
var m = new flwebgl.geom.Matrix(); var arr = m.getValues(); arr[1] = 0.5; m.setValues(arr);
identity()
Descripción
Este método define la matriz en una matriz del tipo Identity.
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
invert()
Descripción
Este método devuelve la matriz. La matriz inversa aplica la transformación opuesta.
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
isIdentity()
Descripción
Este método indica “true” si la matriz es una matriz del tipo Identity.
Valor devuelto
- Tipo: booleano
rotate(angle)
Descripción
Este método aplica una transformación de giro a la matriz.
Parámetros
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
Ejemplo
Este ejemplo crea una nueva instancia de Matrix inicializada en la matriz del tipo Identity y la gira en 45 grados.
Nombre | Tipo | Descripción |
---|---|---|
angle | número | El ángulo expresado en radianes. Para utilizar grados, multiplíquelo por Math.PI/180. |
var m = new flwebgl.geom.Matrix(); m.rotate(45 * Math.PI / 180);
scale(x, y)
Descripción
Este método aplica una transformación de escala a la matriz.
Parámetros
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
Ejemplo
Este ejemplo crea una nueva instancia de Matrix inicializada en la matriz del tipo Identity y cambia su escala en un factor de 2 horizontal y verticalmente.
Nombre | Tipo | Descripción |
---|---|---|
x | número | El factor de escala horizontal. |
y | número | El factor de escala vertical. |
var m = new flwebgl.geom.Matrix(); m.scale(2, 2);
setValues(values)
Descripción
Este método define los valores de los elementos de la matriz.
Parámetros
Ejemplo
Consulte el ejemplo en la función getValues().
Nombre | Tipo | Descripción |
---|---|---|
values | número[] | Un conjunto que define los valores de la matriz en un formato [a b c d tx ty]. |
transformPoint(point)
Descripción
Este método transforma un punto según esta matriz.
Parámetros
Valor devuelto
- El punto transformado.
- Tipo: Point
Nombre | Tipo | Descripción |
---|---|---|
point | Point | El punto que se va a transformar. |
transformRect(rect)
Descripción
Este método transformará los cuatro puntos del rectángulo según esta matriz.
Parámetros
Valor devuelto
- El rectángulo transformado.
- Tipo: Rect
Nombre | Tipo | Descripción |
---|---|---|
rect | Rect | El rectángulo que se va a transformar. |
translate(dx, dy)
Descripción
Este método traduce la matriz en los ejes x e y.
Parámetros
Valor devuelto
- Esta matriz. Resulta útil para concatenar llamadas de método.
- Tipo: Matrix
Nombre | Tipo | Descripción |
---|---|---|
dx | número | Movimiento total hacia la derecha a lo largo del eje X. |
dy | número | Movimiento total hacia abajo a lo largo del eje Y. |