HTML5. Урок #13. SVG и Canvas

by @html_books
HTML5. Урок #13. SVG и Canvas

Сравнение: холст и SVG - графика

Холст:

- объекты рисуются программным способом - рисование на основе пикселей - анимация не встроена - быстрая обработка операций рисования на основе пикселей - нужно принимать во внимание разрешение - нет поддержки обработчиков событий - возможность сохранить получившееся изображение в формате .png или .jpg - хорошо подходит для игр со сложной графикой

SVG

- элементы являются частью модели DOM (объектной модели документа) страницы - рисование осуществляется с помощью векторов - встроены эффекты, такие как анимация - на основе более понятного стандартного синтаксиса XML - не нужно принимать во внимание разрешение - реализована поддержка обработчиков событий - не подходит для игровых приложений - лучше всего подходит для приложений с большой областью отображения (например, Google Maps) В принципе, можно использовать SVG-графику и холст вместе на одной странице, если это необходимо. Тем не менее, нельзя рисовать векторные изображения поверх холста или наоборот.

June 19, 2018
by @html_books