+3 8(066) 185-39-18
fПредмет:
Тип роботи:
Бакалаврська робота
К-сть сторінок:
53
Мова:
Українська
можна побачити у двох іграх, розроблених одним і тим же автором, який хотів продемонструвати використання технологій <svg> і <canvas>: SVG – oids і canvas – pinball. Більш вдалий приклад незалежності рівня графіки від ігрового модуля можна побачити, порівнявши canvas – pinball з SVG – Dice, оскільки в обох випадках застосовується один і той же фізичний модуль. Хоча логіка гри і демонстрації відрізняється, фізичний модуль в обох іграх стежить за позиціями, зіткненнями, швидкостями і іншими фізичними параметрами компонентів гри. Що стосується canvas – pinball, тут настроюється диспетчер анімації верхнього рівня перемальовує сцену за допомогою послідовності API Canvas.
Якщо мова йде про гру SVG Dice, то настроюється диспетчер анімації верхнього рівня використовує перетворення в групах для переміщення існуючої графіки на екрані за допомогою DOM.
Отже, поки одна гра перемальовує і переміщує фігури, інша виконує тільки переміщення, але зберігає фігуру в пам'яті за рахунок виділення ресурсів. Для більшості казуальних ігор подібна ціна досить мала, проте вважається, що для ігор звична ідея використання графічної системи з інтерфейсами API більш низького рівня, що працює в безпосередньому режимі.
Розширені сценарії Можливо, найбільш повнофункціональні сценарії включають об'єднання технологій графіки, стилів і документів.
Проектування користувальницького інтерфейсу Кілька років тому вважалося, що для проектування користувальницького інтерфейсу необхідно використовувати технологію SVG. Вимоги відповідають SVG. Насправді, принаймні один інтерфейс операційної системи Linux створений повністю на базі SVG. Елементи управління зі стандартного внутрішнього набору, такі як повзунки, прапорці, кнопки з округленими кутами і інші нестандартні компоненти, досить просто реалізувати за допомогою векторної графіки. Однак, завдяки недавнім і майбутнім нововведенням в CSS, включаючи закруглені кути, градієнти, фільтри і події – покажчики, переважна більшість цих елементів управління можуть бути розроблені за допомогою стандартних конструкцій HTML для документів з рамкової моделі. Інші елементи керування (особливо після недавнього появи моделей « сітка CSS» і « адаптується блок CSS») скоріше орієнтовані на елементи HTML, принаймні, застосовуються як контейнерів. Тут наведено приклад складної, керованої даними діаграми. Незважаючи на те що вихідні дані спроектовано не дуже вдало, кінцевий результат представлений добре. Загальновідомо, що елементи управління графіками та діаграмами складно розробляти, проте сторонні виробники, як і корпорація Майкрософт, дуже процвітали в цьому. Це знижує навантаження на розробників, надаючи абстракції для прив'язки даних на стороні клієнта або на стороні сервера, але на сьогоднішній день для Інтернету рендеринг на стороні клієнта ще досить статичний або вимагає установки додаткових модулів. У прикладі нижче розширене взаємодія з користувачем забезпечувалося за рахунок багатих можливостей SVG. Незалежно від того коду, який буде наданий клієнтові (в майбутньому можливо більш декларативне взаємодія), діаграма відображається за допомогою двох ключових компонентів. Оточення і дані Оточення або фон діаграми є базовою статичної SVG:
ТЕХНІЧНЕ ЗАВДАННЯ
1.1. ВВЕДЕННЯ
Це технічне завдання поширюється на розробку HTML5 додатку, для візуалізації та маніпуляції сітками елементів.
1.2. ПІДСТАВА ДЛЯ РОЗРОБКИ
HTML5 додаток розробляється на підставі здачі диплома відповідно до плану учбового процесу на 2013-2014 навчальний рік.
1.3. ВИМОГИ ДО ПРОГРАМИ АБО ПРОГРАМНОГО ВИРОБУ
Вимоги до функціональних характеристик:
1. Система повинна забезпечувати можливість виконання наступних функцій:
Можливість маніпулювати елементами;
Виведення координат на екран;
Можливість очищення вікна canvas.
2. Для цих завдань мають бути реалізовані:
Алгоритм, зчитування координат з файлу;
Iмпорт і експорт сіток;
Система авторизації Yii;
Сторінка для додавання сіток на сайт;
Сторінка управління доступними сітками.
3. Вимоги до інформаційної і програмної сумісності:
HTML5 додаток повинен працювати в усіх, нових, веб-браузерах.
ВИСНОВОК
Результати аналізу існуючих технологій векторної графіки, доступних в останніх версіях браузерів говорять про те, що стандартні веб-технології можна інтерактивно і успішно застосовувати в рамках існуючих і нових сценаріїв. У нас є всі можливості, щоб забезпечити декларативною анімації підтримку рекламних площ в майбутньому. При розробці функцій на основі сценаріїв ми можемо випереджати конкурентів і забезпечувати багаті можливості графіки, заснованої на стандартах, у веб-додатках та на веб-сторінках.
РОЗДІЛ №2
Введення
HTML5 Canvas
Минуло вже більше чотирьох років з моменту, коли був анонсований перший чернетку специфікації стандарту розмітки веб -сторінок – HTML5, але до цих пір небагато ресурсів на HTML5 і, напевно, лише сота частка верстальників використовують HTML5 на практиці, при верстці сторінок сайту, хоча всі сучасні браузери підтримують даний стандарт. – це п'ята версія основного мови розмітки веб- сторінок, розробка якої почалася ще в 2007 році. В даний час специфікація HTML5 знаходиться в стадії розробки, закінчити яку планують в 2014 році. Всі сучасні браузери вже підтримують основні елементи HTML5.
Найпомітніші HTML5 можливості – це поява таких тегів як aside, footer, header, nav і article і повна підтримка новітніх типів полів введення у формах, включаючи атрибут placeholder (підказує підказку в поле вводу), phone і email (які забезпечують правильну валідацію), а також ряд новітніх медіа- елементів, які включають audio, video і canvas, що