HTML5 SVG. Diferențele dintre SVG și Canvas. Comparație între Canvas și SVG.
Diferențele dintre SVG și Canvas
SVG este un limbaj pentru descrierea graficelor 2D în XML.
Canvas desenează grafică 2D, pe fugă (cu un JavaScript).
SVG este bazat pe XML, ceea ce înseamnă că fiecare element este disponibil în DOM SVG. Puteți atașa manipulatoare de evenimente JavaScript (JavaScript event handlers) pentru un element.
În SVG, fiecare formă desenată este amintită ca obiect. Dacă se schimbă atributele unui obiect SVG, browserul poate reda automat forma.
Pânza (Canvas) este redată pixel cu pixel. Pe pânză (Canvas), odată ce desenul grafic este desenat, acesta este uitat de browser. Dacă poziția sa ar trebui schimbată, întreaga scenă trebuie redirecționată, inclusiv oricare obiecte care ar putea fi acoperite de grafic.
Comparație între Canvas și SVG
Tabelul de mai jos prezintă câteva diferențe importante între Canvas și SVG:
SVG este un limbaj pentru descrierea graficelor 2D în XML.
Canvas desenează grafică 2D, pe fugă (cu un JavaScript).
SVG este bazat pe XML, ceea ce înseamnă că fiecare element este disponibil în DOM SVG. Puteți atașa manipulatoare de evenimente JavaScript (JavaScript event handlers) pentru un element.
În SVG, fiecare formă desenată este amintită ca obiect. Dacă se schimbă atributele unui obiect SVG, browserul poate reda automat forma.
Pânza (Canvas) este redată pixel cu pixel. Pe pânză (Canvas), odată ce desenul grafic este desenat, acesta este uitat de browser. Dacă poziția sa ar trebui schimbată, întreaga scenă trebuie redirecționată, inclusiv oricare obiecte care ar putea fi acoperite de grafic.
Comparație între Canvas și SVG
Tabelul de mai jos prezintă câteva diferențe importante între Canvas și SVG:
| Canvas | SVG |
|---|---|
|
|