ДЕРЖАВНИЙ ВИЩИЙ НАВЧАЛЬНИЙ ЗАКЛАД

«ЗАПОРІЗЬКИЙ НАЦІОНАЛЬНИЙ УНІВЕРСИТЕТ»

МІНІСТЕРСТВА ОСВІТИ І НАУКИ УКРАЇНИ

МАТЕМАТИЧНИЙ ФАКУЛЬТЕТ

КАФЕДРА МАТЕМАТИЧНОГО МОДЕЛЮВАННЯ

Кваліфікаційна робота бакалавра

на тему: «РОЗРОБКА HTML5 ДОДАТКУ ДЛЯ ВІЗУАЛІЗАЦІЇ ТА МАНІПУЛЯЦІЇ СІТКАМИ ЕЛЕМЕНТІВ»

Виконав:	студент		4		курсу, групи	5130-1
напряму підготовки				6.040201 – математика
				(шифр і назва напряму підготовки)
Є.А. Коваль
(ініціали та прізвище)
Керівник		доцент, к.ф.-м.н. Чопоров С.В.
		(посада, вчене звання, науковий ступінь, прізвище та ініціали)
Рецензент		доцент, к.ф.-м.н. Курапов С.В.
		(посада, вчене звання, науковий ступінь, прізвище та ініціали)

Запоріжжя – 2014

ЗМІСТ

КВАЛІФІКАЦІЙНА РОБОТА БАКАЛАВРА 1

ЗМІСТ 1

Вступ 3

1. SVG або Canvas 4

1.1 ВВЕДЕННЯ 31

1.2 ПІДСТАВА ДЛЯ РОЗРОБКИ 31

1.3 ВИМОГИ ДО ПРОГРАМИ АБО ПРОГРАМНОГО ВИРОБУ 31

РОЗДІЛ №2 33

Введення 33

РОЗДІЛ №3 51

Вступ

HTML еволюціонує , забезпечуючи поліпшену і складнішу стандартну графіком , що сприяє підвищенню якості взаємодії з користувачами . Це дає веб- розробникам можливість використовувати веб- технології на основі стандартів для створення інтерактивних сайтів і додатків зі складною графікою , не вдаючись до спеціалізованих технологіям , або написати код для конкретного браузера . У наступному розділі наведено основні поняття векторної графіки , а також : • розглядаються відмінності між безпосереднім режимом і абстрактним режимом ; • описується елемент Canvas HTML5 , використовуваний для графіки в безпосередньому режимі, і наводиться огляд технології Canvas ; • вводиться поняття масштабованої векторної графіки ( SVG ) , описується набір елементів HTML5 , використовуваних для графіки абстрактного режиму і дається огляд SVG ; • дані інструкції для нових і досвідчених розробників щодо застосування тієї чи іншої моделі векторної графіки (або обох залежно від сценарію) до векторної графіки і HTML5.

1. Svg або Canvas

У цьому розділі ми розглянемо порівняння SVG і Canvas ; наведемо порівняльні приклади коду , наприклад для побудови ходу променя і роботи з " зеленим екраном" . Примітка Для перегляду багатьох прикладів даного розділу потрібно браузер ( такий як Windows Internet Explorer 9 ) , що підтримує елементи SVG і Canvas .

1.1 Векторна графіка

Векторна графіка не є новим поняттям . Для створення зображення у векторній графіці використовуються геометричні примітиви ( фігури , точки , лінії і багатокутники ) . Наприкінці шістдесятих в мову програмування Logo був доданий мова опису векторної графіки ( " черепашача графіка" ) для підтримки робота- черепахи , розробленого для виконання функцій малювання . З того часу складність графіки істотно зросла , проте основні поняття графіки залишилися колишніми. За рівнем складності векторна графіка може бути простою , середньої складності і дуже складною. Нижче наведені приклади графіки різних рівнів складності. Проста - виноска в документі або ілюстрації . Середньої складності - ілюстрації ( наприклад , діаграми , схеми і карти). Дуже складна - документи ( наприклад, використовувані при проектуванні ) . Незважаючи на те що наведені приклади статичні , векторна графіка підтримує інтерактивність. Інтерактивність є ключовою функцією, що дозволяє істотно розширити можливості в цих сценаріях . Векторна графіка забезпечує інтерактивні і статичні формати для веб -додатків , додатків для настільних систем і пристроїв.