JavaScript canvas: опис, можливості, приклади, відгуки

Полотно складається з тегом canvas, але коли кажуть про нього, посилаються на API, який включає в себе набір функцій для малювання ліній, прямокутників, кіл, дуг, масштабування, перетворення графічних елементів.

У разі полотна на веб-сторінці це прямокутна область для растрового зображення, в якому кожній координаті присвоюється колір. Canvas JavaScript не створює векторні об’єкти в стилі інших середовищ, таких як SVG або Flash, а тільки растрові в якості малюнка.

Фактично можна завантажити зображення в Canvas і маніпулювати його пікселями по одному. Сервіс нещодавно був включений в HTML і не підтримується старими браузерами. Для них зручно надати альтернативний контент у вигляді фіксованого малюнка або пояснювального тексту.

Технологія Canvas проти Flash

Canvas JavaScript (холст) – це стандартний елемент HTML5, оброблюваний сучасними браузерами. Flash – це технологія компанії, яка вимагає установки плагіна. На сьогодні в більшості браузерів встановлений плагін Flash, тому як і раніше, функціонують ті, які не підтримують Canvas. Однак динаміка розвитку свідчить про те, що ситуація може змінитися дуже швидко, так як нові платформи вже не працюють з “Флеш”.

Однак більшість фахівців в області графіки вважають, що працювати з Flash простіше і швидше, ніж з полотном, оскільки він має розширену середовище графічного дизайну (Adobe Flash CS6), а процес створення графіки Canvas JavaScript трохи важче. Ситуація повинна змінитися з появою фреймворків в стилі paper.js. Проте слід врахувати, що новий сервіс безкоштовний і відкритий, тому не потрібно витрачати гроші на ліцензію. Flash належить Adobe. Це пояснює той факт, що сьогодні складні ігри все ще створюються з його допомогою.

Якщо потрібно використовувати графіку в декількох дозволах, векторна технологія “Флеш” більш ефективна, ніж растровий Canvas. Але для більшості веб-графіки полотно завантажується швидше. Flash вимагає більше ресурсів для запуску, тому на мобільних пристроях у Canvas JavaScript є суттєва перевага. Полотно дозволяє створювати графіку всіх видів, від прямої лінії до інтерактивних ігор, а також дає можливість редагувати зображення, змінювати тон і межі.