Utilizzando il metodo lineWidth è possibile avere linee di differente spessore. Il metodo accetta un valore numerico. Ecco il listato: <!DOCTYPE html> <html> <body> <canvas id=”myCanvas” width=”200″ height=”200″ style=”border:1px solid [ … ]
Categoria: Javascript
Cerchi ed archi in javascript
Per disegnare un cerchio o una parte di esso (cioè un arco) si usa il comando arc. I parametri sono i seguenti: arc(Xc,Yc,r, angolo iniziale, angolo finale); dove Xc ed [ … ]
Rettangolo con dimensioni casuali
Disegnare un rettangolo con altezza H e base B generati casualmente. Di seguito il listato: <html> <body> <canvas id=”myCanvas” width=”300″ height=”150″ style=”border:1px solid #d3d3d3;”></canvas> <script> var c = document.getElementById(“myCanvas”); var [ … ]
Rettangolo con i lati di colore diverso
Disegnare un rettangol usando il comando lineTo e cambiando colore alla linea ad ogni lato. Il listato è il seguente: <html> <body> <canvas id=”myCanvas” width=”300″ height=”150″ style=”border:1px solid #d3d3d3;”></canvas> <script> [ … ]
Rettangolo con diagonali
Disegnare un rettangolo di dimensioni a piacere con la sue due diagonali. Il listato è il seguente: <!DOCTYPE html> <html> <body> <canvas id=”myCanvas” width=”600″ height=”300″ style=”border:1px solid #d3d3d3;”></canvas> <script> var [ … ]
Triangolo equilatero
Disegnare un triangolo equilatero utilizzando i metodi lineTo e moveTo Ecco il listato: <html> <body> <canvas id=”myCanvas” width=”400″ height=”300″ style=”border:1px solid #d3d3d3;”></canvas> <script> var c = document.getElementById(“myCanvas”); var ctx = [ … ]