Гэты элемент мае свае перавагі ў параўнанні з іншымі тэхналогіі
HTML5 ўключае ў сябе захапляльны элемент пад назвай Canvas. Ён мае мноства ужыванняў, але для таго, каб выкарыстоўваць яго вам трэба вывучыць некаторыя JavaScript, HTML, а часам і CSS.
Гэта робіць палатно элемент трохі складаны для шматлікіх дызайнераў, і на самай справе, большасць, верагодна, ігнараваць элемент да таго часу, пакуль надзейныя прылады для стварэння CANVAS анімацыі і гульняў, не ведаючы JavaScript.
Што HTML5 Canvas Выкарыстоўваецца для
CANVAS элемент HTML5 можа выкарыстоўвацца для многіх рэчаў, якія раней, трэба было выкарыстоўваць убудаванае прыкладанне, як Flash, для стварэння:
- дынамічныя графікі
- онлайн і афлайн гульні
- анімацыі
- інтэрактыўнае відэа і аўдыё
На самай справе, галоўная прычына, людзі выкарыстоўваюць элемент CANVAS, таму што, як лёгка ператварыць простую вэб-старонку ў дынамічны вэб-прыкладанні, а затым пераўтварыць гэта прыкладанне ў мабільнае прыкладанне для выкарыстання на смартфонах і планшэтах.
Калі ў нас ёсць Flash, Навошта нам патрэбен палатно?
Паводле спецыфікацыі HTML5, элемент CANVAS з'яўляецца:
«... дазвол у залежнасці ад растравы палатно, які можа быць выкарыстаны для рэндэрынгу графікі, гульнявой графікі, мастацтва або іншых візуальных вобразаў на ляту".Элемент CANVAS дазваляе маляваць графікі, графікі, гульні, мастацтва і іншыя візуальныя эфекты прама на вэб-старонкі ў рэжыме рэальнага часу.
Вы маглі б думаць, што мы ўжо можам зрабіць гэта з Flash, але ёсць два асноўных адрозненні паміж палатном і Flash:
- Элемент CANVAS убудаваны прама ў HTML. Сцэнары, якія прыцягваюць на яго або ў HTML або ў звязаным вонкавым файле. Гэта азначае, што элемент палатно з'яўляецца часткай аб'ектнай мадэлі дакумента, або DOM.
- Ўспышка убудаваны знешні файл. Ён выкарыстоўвае альбо EMBED або OBJECT элемент для адлюстравання і не могуць непасрэдна ўзаемадзейнічаць з іншымі HTML элементамі. Паколькі элемент CANVAS з'яўляецца часткай DOM, ён можа ўзаемадзейнічаць з DOM ў многіх адносінах.
- Напрыклад, вы можаце стварыць анімацыю, якая змяняецца, калі якая-небудзь іншая частка старонкі ўзаемадзейнічала з. - такімі як элементам формы запаўняюцца з Flash, найбольш вы маглі б зрабіць, каб пачаць флэш-ролік або анімацыю, але з CANVAS можна стварыць мноства розных эфектаў, нават дадаць тэкст з поля формы ў анімацыю.
- Элемент CANVAS першапачаткова падтрымліваецца вэб-браўзэраў. Для таго, каб карыстальнікі на самай справе выкарыстаць Flash, іх браўзэр павінен быць усталяваны убудова. Гэта часта клопаты для большасці людзей з-за састарэлы флэш ўсталёўвае або той факт, што іх аперацыйная сістэма проста не падтрымлівае яго.
- Ён не меў звычай быць, што кожны браўзэр быў усталяваны ўбудова, але гэта ўжо не так, і многія з іх нават выдалення ўбудовы з-за цяжкасці. Акрамя таго, гэта нават не даступна на папулярнай платформе IOS.
Canvas карысна, нават калі вы ніколі не планавалі выкарыстоўваць выбліск
Адна з галоўных прычын, чаму элемент CANVAS настолькі заблытаны, што многія дызайнеры ўжо прывыклі да цалкам статычнай сеткі. Выявы могуць быць аніміраваныя, але гэта зроблена з GIF, і, вядома, вы можаце ўстаўляць відэа на старонкі, але зноў жа, гэта статычнае відэа, якое проста сядзіць на старонцы і, магчыма, пачынаецца або спыняецца з-за ўзаемадзеяння, але гэта ўсё.
Элемент CANVAS дазваляе дадаваць столькі больш інтэрактыўнасці на вэб-старонку, таму што цяпер вы можаце кантраляваць графікі, малюнкі і тэкст дынамічна з дапамогай мовы сцэнарыяў. Элемент CANVAS дазваляе ўключыць малюнка, фатаграфіі, дыяграмы і графікі ў анімацыйных элементаў.
Калі разгледзець пытанне аб выкарыстанні Canvas элемента
Ваша аўдыторыя павінна быць вашым першым меркаваннем пры прыняцці рашэння, ці варта выкарыстоўваць элемент Canvas.
Калі ваша аўдыторыя ў асноўным з дапамогай Windows XP і IE 6, 7 ці 8, а затым стварыць функцыю дынамічнага палатна будзе бессэнсоўна, паколькі гэтыя браўзэры не падтрымліваюць яго.
Калі вы ствараеце прыкладанне, якое будзе выкарыстоўвацца толькі на машынах Windows, то ўспышка можа быць вашым лепшым выбарам. Дадатак будзе выкарыстоўвацца на Windows, і Mac кампутараў можа атрымаць выгаду з Silverlight прыкладання.
Аднак, калі неабходна праглядаць на мабільных прыладах (як Android і IOS), а таксама сучасныя настольныя кампутары прыкладання (абноўлена да апошняй версіі браўзэра), затым з дапамогай графічнага элемента з'яўляецца добрым выбарам.
Майце на ўвазе, што выкарыстанне гэтага элемента дазваляе мець варыянты замяшчае як статычныя выявы для старых браўзэраў, якія не падтрымліваюць яго.
Тым не менш, не рэкамендуецца выкарыстоўваць HTML5 палатно для ўсяго. Вы ніколі не павінны выкарыстоўваць яго для такіх рэчаў , як ваш лагатып, загаловак або навігацыі (хоць выкарыстанне яго аніміраваць частка любога з іх будзе ў парадку).
Паводле спецыфікацыі, вы павінны выкарыстоўваць тыя элементы, якія з'яўляюцца найбольш прыдатнымі для таго, што вы спрабуеце пабудаваць. Такім чынам, выкарыстоўваючы элемент HEADER разам з выявамі і тэкстам пераважней CANVAS элемента для вашага загалоўка і лагатыпа.
Акрамя таго, калі вы ствараеце вэб-старонку або дадатак, прызначаную для выкарыстання ў неінтерактівного асяроддзі, як друк, вы павінны ведаць, што CANVAS элемент, які дынамічна абнаўляецца не можа друкаваць, як вы чакаеце. Вы можаце атрымаць друк бягучага змесціва або з рэзервовага ўтрымання.