Descriere HTML5 <canvas> tag - ul este folosit pentru a desena grafice, pe zbor, prin scripting (usually JavaScript) de (usually JavaScript) .
Cu toate acestea, <canvas> elementul nu are abilități de desen proprii (acesta este doar un container pentru grafica) - trebuie să utilizați un script pentru a desena grafica.
getContext() metoda returneaza un obiect care oferă metode și proprietăți pentru desen pe panza.
Această referință va acoperi proprietățile și metodele de getContext("2d") obiect, care poate fi folosit pentru a desena text, linii, cutii, cercuri, și multe altele - pe panza.
Suport pentru browser- Numerele din tabel specifica prima versiune de browser care acceptă pe deplin elementul.
Element <canvas> 4 9 2.0 3.1 9
Internet Explorer 9, Firefox, Opera, Chrome și Safari sprijin <canvas> și proprietățile și metodele sale.
Note: Internet Explorer 8 și versiunile anterioare, nu acceptă <canvas> element.
Culori, stiluri și umbre Proprietate Descriere fillStyle Setează sau returnează culoarea, gradientul, sau modelul utilizat pentru a umple desenul strokeStyle Setează sau returnează culoarea, gradientul sau model utilizat pentru accidente vasculare cerebrale shadowColor Setează sau returnează culoare pentru a utiliza pentru umbre shadowBlur Setează sau returnează nivelul blur pentru umbre shadowOffsetX Setează sau returnează distanța orizontală umbra de forma shadowOffsetY Setează sau returnează distanța pe verticală a umbrei din forma
Stiluri de linie Proprietate Descriere lineCap Setează sau returnează stilul de capace pentru o linie lineJoin Setează sau returnează tipul de colț a creat, atunci când două linii îndeplinesc lineWidth Setează sau returnează lățimea liniei curente miterLimit Setează sau returnează lungimea maximă de tăiere oblică
dreptunghiuri Metodă Descriere rect() Creează un dreptunghi fillRect() Deseneaza o "filled" dreptunghi strokeRect() Deseneaza un dreptunghi (no fill) clearRect() Golește pixeli specificate într-un anumit dreptunghi
Căi Metodă Descriere fill() Umple desenul curent (path) stroke() De fapt, atrage calea pe care ați definit beginPath() Începe o cale, sau resetează calea curentă moveTo() Mută calea către punctul specificat în pânză, fără a crea o linie closePath() Creează o cale de la punctul curent înapoi la punctul de plecare lineTo() Adaugă un nou punct și creează o linie la acel punct din ultimul punct specificat în pânza clip() Clipuri o regiune de orice formă și dimensiune din original panza quadraticCurveTo() Creează o curbă Bezier pătratică bezierCurveTo() Creează o curbă Bezier cubică arc() Creează un arc / curba (used to create circles, or parts of circles) arcTo() Creează un arc / curba între două tangentele isPointInPath() Returnează true dacă punctul specificat este în calea curentă, în caz contrar fals
transformări Metodă Descriere scale() Scalează desenul curent mai mare sau mai mică rotate() Rotește desenul curent translate() Remaps (0,0) , poziția pe panza transform() Înlocuiesc matricea de transformare curentă pentru desen setTransform() Reseteazã curent transforma în matricea de identitate. Apoi , se execută transform()
Text Proprietate Descriere font Setează sau returnează proprietățile fontului curent pentru conținutul textului textAlign Setează sau returnează alinierea curentă pentru conținutul textului textBaseline Setează sau returnează linia de bază a textului curent utilizat la elaborarea textului
Metodă Descriere fillText() Atrage "filled" text pe panza strokeText() Atrage text pe panza (no fill) measureText() Returnează un obiect care conține lățimea textului specificat
Desen de imagine Metodă Descriere drawImage() Desenează o imagine, panza sau video pe pânză
Pixel Manipularea Proprietate Descriere width Returnează lățimea unui obiect ImageData height Returnează înălțimea unui obiect ImageData data Returnează un obiect care conține datele de imagine ale unui obiect ImageData specificat
Metodă Descriere createImageData() Creează un obiect nou, ImageData gol getImageData() Returnează un obiect ImageData care copiază datele de pixeli pentru dreptunghiul specificat pe o pânză putImageData() Plasează datele de imagine (from a specified ImageData object) de (from a specified ImageData object) înapoi pe pânză
compunere Proprietate Descriere globalAlpha Setează sau returnează alfa sau transparență valoarea curentă a desenului globalCompositeOperation Setează sau returnează modul în care sunt desenate o noua imagine pe o imagine existentă
Alte Metodă Descriere save() Salvează starea de contextul actual restore() Returnează starea cale salvată anterior și atributele createEvent() getContext() toDataURL()