Atunci când creați un element de panza, trebuie să setați atributul id (specifică numele elementului pentru accesarea acestuia din scripturi) și dimensiunile acestuia utilizând atributele de lățime și înălțime.
Conținutul plasat între etichete va fi afișat dacă browserul utilizatorului nu acceptă elementul de panza.
Fiți atenți: pânza în sine nu atrage nimic. Este o pânză care oferă oportunități pentru a desena script-uri client.
Desenează un dreptunghi plin.
Desenează un dreptunghi ne-vopsit.
Șterge zona specificată, făcând-o complet transparentă.
Notă: parametrii x și y specifică valoarea decalajului orizontal (x) și vertical (y) din colțul din stânga sus al pânzei în pixeli.
Acum să încercăm să desenezi ceva pe pânză.
- var canvas = document.getElementById ("draw") - găsiți panza dorită;
- var x = canvas.getContext ("2d") - se referă la obiectul încorporat care conține diferite metode de desenare (primii doi pași sunt standard pentru desenarea oricărui obiect în panza);
- x.fillRect (50,40,55,55) - trageți un dreptunghi umplut;
- x.strokeRect (150,70,55,55) - desenați un dreptunghi ne-vopsit;
- x.clearRect (68,57,20,20) - curățați zona din dreptunghiul umplut.
Figurile compuse constau din mai multe obiecte simple legate (cum ar fi linii, cercuri etc.).
Notă: metoda closePath () poate să nu fie prezentă.