HTML canvas translate() Metodo
Esempio
Disegna un rettangolo in posizione (10,10), imposta la nuova posizione (0,0) su (70,70). Disegna di nuovo lo stesso rettangolo (nota che il rettangolo ora inizia in posizione (80,80):
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillRect(10, 10, 100, 50);
ctx.translate(70, 70);
ctx.fillRect(10, 10, 100, 50);
Supporto del browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente il metodo.
Method | |||||
---|---|---|---|---|---|
translate() | Yes | 9.0 | Yes | Yes | Yes |
Definizione e utilizzo
Il metodo translate() rimappa la posizione (0,0) sull'area di disegno.
Nota: quando si chiama un metodo come fillRect() dopo translate(), il valore viene aggiunto ai valori delle coordinate x e y.
sintassi JavaScript: | contesto .translate( x,y ); |
---|
Valori dei parametri
Nota: è possibile specificare uno o entrambi i parametri.
Parameter | Description | Play it |
---|---|---|
x | The value to add to horizontal (x) coordinates | |
y | The value to add to vertical (y) coordinates |
❮ Riferimento tela HTML