English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
La funzione rotate() aggiunge un metodo di rotazione nei matrici di trasformazione dell'API Canvas 2D. Il valore dell'angolo rappresenta un angolo di rotazione in senso orario e viene espresso in radianti.
Manuale di riferimento HTML canvas
Rotare il quadrato di 30 gradi:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Utilizzo del metodo rotate() su HTML canvas - Tutorial di base (oldtoolbag.com)</title>
</head>
<body>
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
Il suo browser non supporta il tag HTML5 canvas.
</canvas>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.rotate(10*Math.PI/180);
ctx.fillRect(50,50,100,100);
</script>
</body>
</html>Prova a vedere ‹/›IEFirefoxOperaChromeSafari
Internet Explorer 9, Firefox, Opera, Chrome e Safari supportano rotate() Metodi.
Attenzione:Internet Explorer 8 e le versioni precedenti non supportano l'elemento <canvas>.
Il metodo rotate() ruota il disegno corrente.
Attenzione:La rotazione influisce solo sul disegno creato dopo la rotazione.
| Sintassi JavaScript: | context.rotate(angolo); |
|---|
| Parametro | Descrizione |
|---|---|
| angolo | Angolo di rotazione, espresso in radianti. Per convertire gli angoli in radianti, utilizzare gradiCalcolo con la formula *Math.PI/180. Esempio: Per ruotare di 5 gradi, si può stabilire la seguente formula: 5 * Math.PI / 180. |