---

Простой язык для описания и генерации диаграмм в HTML5-документе

Вернуться к списку проектовНа главную страницу курса

Заказчик

Колосов Александр Сергеевич, старший преподаватель кафедры Информатики и математического обеспечения. Эл.почта: akolosov@cs.karelia.ru.

Инструктор

Димитров Вячеслав Михайлович, преподаватель кафедры Информатики и математического обеспечения. Эл.почта: dimitrov@cs.karelia.ru. Раб.тел.: 711015. Офис: 215 каб.

Аннотация проекта

В научно-технических текстах для иллюстрации абстрактных концепций применяются различные виды диаграмм: блок-схемы, графики, карты и др. Существует большое разнообразие программ для создания таких иллюстраций, в число которых входят как векторные редакторы общего назначения, так и специализированные инструменты для создания диаграмм конкретного типа. Однако, как правило, все они обладают одним существенным недостатком — отрисовка и позиционирование элементов диаграммы выполняется вручную с помощью мыши. В результате, при создании достаточно сложных диаграмм, бо́льшая часть времени тратится на выравнивание элементов по регулярной сетке.

Альтернативным подходом является применение декларативного языка для описания элементов диаграммы, связей между ними, а также способов их размещения на рисунке (относительно друг друга или в соответствии с некоторой сеткой). На основе полученного описания затем генерируется изображение.

Реализацию такого подхода можно встретить в инструменте визуализации графов Grpahviz (см. примеры), а также в пакете для создания векторных изображений TikZ/PGF (см. пример) для системы компьютерной вёрстки T_eX. В рамках данного проекта предлагается реализовать вышеописанный подход на базе технологий HTML5. Необходимо разработать инструмент, позволяющий описывать внутри HTML-документа диаграммы, состоящие из заданных элементов этого документа. Должны предоставляться следующие возможности.

• Возможность относительного позиционирования HTML-элементов. Например: "справа от элемента с заданным id".
  • Должны поддерживаться следующие варианты размещения: справа, слева, сверху, снизу, левый верхний угол, левый нижний угол, правый верхний угол, правый нижний угол.
  • При задании относительного местоположения может быть также задано расстояние от объекта.
• Возможность указания наличия связывающих линий между элементами.
  • Связывающие линии должны создаваться автоматически, а не описываться пользователем как отдельные HTML-элементы.
  • При описании линии для нее могут быть указаны следующие атрибуты: толщина, стиль (сплошная, пунктир, штрих-пунктир и т.д.), стрелка начала, стрелка конца.
• Возможность описания примитивных объектов эллипс и прямоугольник с заданными геометрическими параметрами.
  • Может быть задан текст внутри этих объектов.
  • Могут быть заданы атрибуты: цвет фона, цвет обводки, толщина обводки, стиль обводки (сплошная, пунктир, штрих-пунктир и т.д.).
• Описание диаграм должно задаваться внутри HTML-документа и интерпретироваться в момент отображения документа браузером.

Ссылки

Разработчики

1. Казначеева Екатерина Олеговна, 22303
2. Кузнецова Ирина Сергеевна, 22303
3. Кучумов Руслан Ильдусович, 22304
4. Аникиева Светлана Алексеевна, 22303
5. Трофимова Екатерина Владимировна, 22303
6. Епифанов Валерий Константинович, 22304

---