Esempio
Disegnare un rettangolo in posizione (10,10) , impostare nuovi (0,0) grado di (70,70) . Tracciate di nuovo stesso rettangolo (notice that the rectangle now starts in position (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);
Prova tu stesso " Supporto browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente il metodo.
Metodo | |||||
---|---|---|---|---|---|
translate() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Definizione e l'utilizzo
Il translate() il metodo remaps il (0,0) la posizione sulla tela.
Note: Quando si chiama un metodo come fillRect() dopo translate() , il valore viene aggiunto al x e valori coordinata y.

sintassi JavaScript: | context . translate( x,y ) ; |
---|
valori dei parametri
Note: È possibile specificare uno o entrambi i parametri.
Parametro | Descrizione | Gioca |
---|---|---|
x | Il valore da aggiungere orizzontali (x) coordinate | Gioca " |
y | Il valore da aggiungere alla verticale (y) coordinate | Gioca " |
<Oggetto Tela