setTransform lienzo HTML método ()
Ejemplos
Dibujar un rectángulo por setTransform () restablecer y crear una nueva matriz de transformación, dibujar un rectángulo de nuevo, reiniciar y crear una nueva matriz de transformación, y luego dibujar un rectángulo de nuevo. Tenga en cuenta que cada vez que se llama a setTransform (), que restablece antes de una matriz de transformación y luego construir una nueva matriz, en el siguiente ejemplo, el rectángulo rojo no se muestra porque está por debajo del rectángulo azul:
JavaScript:
var ctx=c.getContext("2d");
ctx.fillStyle="yellow";
ctx.fillRect(0,0,250,100)
ctx.setTransform(1,0.5,-0.5,1,30,10);
ctx.fillStyle="red";
ctx.fillRect(0,0,250,100);
ctx.setTransform(1,0.5,-0.5,1,30,10);
ctx.fillStyle="blue";
ctx.fillRect(0,0,250,100);
Trate »
Soporte para el navegador
Internet Explorer 9, el método de Firefox, Opera, Chrome y Safari setTransform apoyo ().
Nota: 8 y versiones anteriores de Internet Explorer no son compatibles con el elemento <canvas>.
Definición y Uso
Cada objeto en el lienzo tiene una matriz de transformación actual.
setTransform método () a la matriz de transformación actual Restablece la matriz, y luego ejecuta con los mismos parámetros de la Transformación () .
En otras palabras, setTransform () le permite hacer zoom, rotar, mover e inclinar el entorno actual.
Nota: Este método de conversión sólo afectará setTransform () se llama después del sorteo.
| la sintaxis de JavaScript: | contexto .setTransform (a, b, c, d, e, f); |
|---|
parámetro Valor
| 参数 | 描述 |
|---|---|
| a | 水平缩放绘图。 |
| b | 水平倾斜绘图。 |
| c | 垂直倾斜绘图。 |
| d | 垂直缩放绘图。 |
| e | 水平移动绘图。 |
| f | 垂直移动绘图。 |