Metodo HTML canvas scale()
Esempio
Disegna un rettangolo, ridimensiona al 200%, quindi disegna nuovamente il rettangolo:
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.strokeRect(5, 5, 25, 15);
ctx.scale(2, 2);
ctx.strokeRect(5, 5, 25, 15);
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente il metodo.
| Method | |||||
|---|---|---|---|---|---|
| scale() | Yes | 9.0 | Yes | Yes | Yes |
Definizione e utilizzo
Il metodo scale() ridimensiona il disegno corrente, più grande o più piccolo.
Nota: se si ridimensiona un disegno, verranno ridimensionati anche tutti i disegni futuri. Anche il posizionamento verrà ridimensionato. Se ridimensioni(2,2); i disegni verranno posizionati due volte più lontano dalla parte sinistra e dalla parte superiore dell'area di disegno come specificato.
| sintassi JavaScript: | contesto .scale ( larghezza di scala, altezza di scala ); |
|---|
Valori dei parametri
| Parameter | Description | Play it |
|---|---|---|
| scalewidth | Scales the width of the current drawing (1=100%, 0.5=50%, 2=200%, etc.) | |
| scaleheight | Scales the height of the current drawing (1=100%, 0.5=50%, 2=200%, etc.) |
Altri esempi
Esempio
Disegna un rettangolo, ridimensiona al 200%, disegna di nuovo il rettangolo, ridimensiona al 200%, disegna di nuovo il rettangolo, ridimensiona al 200%, disegna di nuovo il rettangolo:
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.strokeRect(5, 5, 25, 15);
ctx.scale(2, 2);
ctx.strokeRect(5, 5, 25, 15);
ctx.scale(2, 2);
ctx.strokeRect(5, 5, 25, 15);
ctx.scale(2, 2);
ctx.strokeRect(5, 5, 25, 15);
❮ Riferimento tela HTML