Главная Контакты Добавить в избранное Авторы Вопросы и ответы
,

УДК 004.738.5

ПОСТРОЕНИЕ НАВИГАЦИИ ДЛЯ ИЕРАРХИЧЕСКИХ СТРУКТУР В WEB-СИСТЕМАХ И СИСТЕМАХ УПРАВЛЕНИЯ WEB-САЙТОМ

Беляев А.В.

Постановка проблемы и анализ публикаций. Основным способом представления информации в Интернет является гипертекстовая web-среда.  Документ в формате гипертекста, помимо текстовой, графической и мультимедийной информации, может содержать связи на другие  документы или их фрагменты. С помощью связей можно организовать навигацию по всем созданным документам. Сформированные таким образом сложные информационные ресурсы имеющют  нелинейной структуру. Благодаря этим возможностям  гипертекст и получил всеобщее признание [1].

Однако рост количества публикаций в гипертекстовой web-среде и отсутствие универсальных схем навигации по большому количеству документов, зачастую приводит к дезориентации пользователей. Например, знакомясь с учебным материалом, представленном в гипертекстовом формате, необходимо пройти по всем разделам ресурса, однако в неструктурированной специальным  образом  гипертекстовой среде, очень легко  пропустить какой-нибудь важный материал.

В Интернет вся информация  сгруппирована в web-ресурсы, отличительной особенностью каждого из них является собственная система навигации. Это может быть: линейная структура, иерархическая структура, нелинейная структура, смешанная структура [2]. Построение подобной системы для web-ресурсов с небольшим количеством разделов не представляет собой сложную задачу, а навигация загружается вместе с документом полностью. Однако для web-ресурсов большого объема такая схема не подходит. Поскольку каналы связи имеют ограничения по скорости передачи данных, а  web-сервер имеет ограничения по продолжительности сессий, передача большого объема информации между клиентом и сервером может происходить в течение длительного времени либо вообще прерваться[3].

Цель статьи. В данной статье рассмотрен способ построения навигации для древовидной, иерархической структуры, которая не потребует предварительной загрузки всей панели навигации, загружаются только разделы верхнего уровня.  Листовые узлы такой системы позволяют  при «клике» мышки развернуть  соответствующий список (ветку дерева). При этом формирование и появление списка должно происходить  динамически,  в момент совершения клика. В основу способа, рассмотренного,  в данной статье,  взяты возможности таких технологий как JavaScript и объекта XMLHttpRequest [4, 5], составляющие костяк технологи AJAX. А так же учтены особенности реализации этой схемы для наиболее популярных версий web-браузеров.

Основная часть

Представим себе web-систему, в которой  содержимое и структура определены в реляционной  базе данных, и представлены двумя таблицами «объекты» и «связи», рисунок 1. Наиболее часто структура  web-сайта  представляет собой древовидную иерархию, рисунок 2. Каждая ветка иерархической структуры представляет собой линейный список. Выборка ветки дерева с помощью SQL будет выглядеть следующим образом:

 

SELECT * FROM `object` , `relation` WHERE parent = id_листа and child = id,            (1)

 

Определим  функцию, которая используя запрос  (1) будет возвращать массив связанных объектов узла ID:

 

function childNodes($ID)                                                                  (2)

 

 

Исполнение функции (1), содержащее обращение к базе данных возможно только на стороне web-сервера. Поэтому следующей задачей является создание механизма обращения к web-серверу без перезагрузки страницы в момент «клика» на узел, подразделы которого мы хотим увидеть.

Такая возможность появилась не так давно. В начале Microsoft Internet Explorer  создал элемент ActivX, а затем Mozila Firefox и Opera также создали объект XMLHttpRequest.

В Microsoft Internet Explorer он определяется:

 

var req = new ActiveXObject("Microsoft.XMLHTTP");

 

В Mozilla и Opera это делается проще (так как там это объект, встроенный в JavaScript):

 

var req = new XMLHttpRequest();

 

Для обеспечения поддержки функции во всех версиях браузеров необходимо создать две ветки. Наиболее удачный механизм вызова объекта XMLHttpRequest приведен на сайте компании Apple [5],  воспользуемся им для решения наших задач. Первый фрагмент это функция, реализующая непосредственный запрос к удаленному серверу, в качестве параметра url необходимо будет подставить удаленный адрес программы, содержащей функцию (2):

 

 

Подпись: var req;
function loadXMLDoc(url) {
req = false;
// ветка для объекта XMLHttpRequest object
if(window.XMLHttpRequest && !(window.ActiveXObject)) {
try {
req = new XMLHttpRequest();
} catch(e) {
req = false;
}
// ветка для Microsoft Internet Explorer /Windows ActiveX version
} else if(window.ActiveXObject) {
try {
req = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
try {
req = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
req = false;
}
}
}
if(req) {
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send("");
}
}

Рис. 3 Функция вызова удаленного документа

 

Здесь стоит обратить внимание на значение onreadystatechange, которому присваивается значение функции processReqChange, являющейся хендлером события, вызываемого при изменении состояния объекта req.

 

Подпись: function processReqChange() {
// только если объект req показывает «load»
if (req.readyState == 4) {
// толькое сли "OK"
if (req.status == 200) {
// здесь необходимо разместить код, возвращенный по удаленному запросу и требующий показа. response = req.responseText;
document.getElementById(Объект в котором должны показаться ответ сервера).innerHTML=response;
response='';
} else {
alert("Проблема восстановления XML данных:\n" +
req.statusText);
}
}
}

Рис. 4 Обработчик события, отвечающий за процесс загрузки удаленного документа

 

Таким образом, удаленный документ должен содержать вызов функции  childNodes($ID) - (1), формирующей. Основной документ, отвечающий за навигацию по древовидной, иерархической структуре, должен содержать:

  • Код отображающий дерево
  • Вызов  события, в узле каждой ветки (например onclick())
  • Обработчик события, вызывающий функцию loadXMLDoc и обработчик processReqChange (рисунки 3, 4)
  • Контейнер для вывода полученного от удаленной функции  линейного списка связанных с узлом объектов
  • Стили CSS, позволяющие управлять видимостью содержания загруженных веток

 

Выводы

Предложенный метод постороения навигацию по древовидной, иерархической структуре, позволяет организовать навигацию для ресурсов повышенного объема, сохраняя возможность динамического перестроения структуры ресурсов, копирования и перемещения веток дерева. В качестве примера реализации данного алгоритма можно привести фрагмент “дерева” сайта газеты «День» (www.day.kiev.ua), реализованного на основе системы управления сайтом CimWebCenter [6] использующей этот метод.

 

 

In given article the way of construction of navigation for treelike, hierarchical structure with leaf like node, which gives possibility to develop the corresponding node at a mouse "clique". Thus formation and list occurrences (a tree branch) should occur dynamically, at the moment of clique fulfillment.

 

1.                  Демин И.С. Проблемы развития гипертекстовых сред. // Вестник Оренбургского государственного университета, 2004, 4.

2.                  Инькова Н.А., Зайцева Е.А., Кузьмина Н.В., Толстых С.Г. СОЗДАНИЕ Web-сайтов // Учебно-методическое пособие. Ч. 5. Тамбов: Изд-во Тамб. гос. техн. ун-та, 2002. 56 с.

3.                  Арушанян О.Б., Богомолов Н.А., Ковалев А.Д., Синицын М.Н. Архитектура клиентского программного обеспечения для WEB-приложений, ориентированных на представление данных // Вычислительные методы и программирование. 2004. Т.5.- C.24-37.

4.                  McLellan D. Very Dynamic Web Interfaces. // The XML.commune February 09, 2005. www.xml.com/pub/a/2005/02/09/xml-http-request.html

5.                  Apple Inc. Dynamic HTML and XML: The XMLHttpRequest // http://developer.apple.com/internet/webcontent/xmlhttpreq.html

6.                  Компания CiM. Документация CimWebCenter //  http://www.cimwebcenter.com/documentation

 





Ответы на вопросы [_Задать вопроос_]

Информационно-измерительные системы

Ковальов О.І. Вимірювання у процесно-орієнтованих стандартах

Полякова М.В., Ищенко А.В., Худайбердин Э.И. Порогово-пространственная сегментация цветных текстурированных изображений на основе метода JSEG

Дзюбаненко А. В. Организация компьютерных систем для анализа изображений

Гордеев Б.Н., Зивенко А.В., Наконечный А.Г. Формирование зондирующих импульсов для полиметрических измерительных систем

Богданов А.В., Бень А.П., Хойна С.И. Релаксация обратного тока диодов Шоттки после их магнитно-импульсной обработки (МИО)

Тверезовский В.С., Бараненко Р.В. Проектирование измерителя добротности варикапов

Тверезовский В.С., Бараненко Р.В. Оптимизированная модель измерителя доб-ротности варикапов

Руднєва М.С., Кочеткова О.В., Задорожній Р.О. Принципи побудови оптимальної структури інформаційно-вимірювальної системи геометричних розмірів об’єктів в діапазоні від 1 нм до 1000 нм

Биленко М.С., Рожков С.А., Единович М.Б. Идентификация деформаций пе-риодических структур с использованием систем технического зрения

Рашкевич Ю.М., Ковальчук А.М., Пелешко Д.Д. Афінні перетворення в модифікаціях алгоритму RSA шифрування зображень

Дидык А.А., Фефелов А.А, Литвиненко В.И., Шкурдода С.В., Синяков Ф. В. Классификация масс-спектров с помощью кооперативного иммунного алгоритма

Клименко А.K. Обратная модель для решения задач в системах с многосвязными динамическими объектами

Завгородній А.Б. Порівняльне дослідження твердотільних і рідиннофазних об'єктів методом газорозрядної візуалізації

Голощапов С.С., Петровский А.В., Рожко Ж.А., Боярчук А.И. Измерение доб-ротности колебательного контура на основе метода биения частот

Кириллов О.Л., Якимчук Г.С. Диагностирование критерия безопасности при заполнении замкнутых объемов СПЖ косвенным методом

Долина В.Г. Проблеми підвищення точності рефрактометра на основі прозорих порожнистих циліндрів.

Самков О.В., Захарченко Ю.А. Застосування алгоритму клонального відбору для побудови планів модернізації авіаційної техніки

Попов Д.В. Метод формування регламентів технічного обслуговування повітряних суден

Казак В.М., Чорний Г.П., Чорний Т.Г. Оцінювання готовності технічних об’єктів з урахуванням достовірності їх контролю

Тверезовский В.С., Бараненко Р.В. Технические аспекты проектирования цифрового измерителя добротности варикапов

Тверезовский В.С., Бараненко Р.В. Технические аспекты проектирования устройства для разбраковки варикапов по емкостным параметрaм и добротности

Сосюк А.В. Інтелектуальний автоматизований контроль знань в системах дистанційного навчання

Соколов А.Є. Деякі аспекти систезу комп’ютеризованої адаптивної системи навчання

Полякова М.В., Волкова Н.П., Іванова О.В. Сегментація зображень стохастичних текстур амплітудно-детекторним методом у просторі вейвлет-перетворення

Луцкий М.Г., Пономаренко А.В., Филоненко С.Ф. Обработка сигналов акустической эмиссии при определении положения сквозных дефектов

Литвиненко В.И., Дидык А.А., Захарченко Ю.А. Компьютерная система для решения задач классификации на основе модифицированных иммунных алгоритмов

Лубяный В.З., Голощапов С.С. Прямоотсчетные измерители расхождений емкостей

Терновая Т.И., Сумская О.П., Слободянюк И.И., Булка Т.И. Контроль качества тканей специального назначения с помощью автоматических систем.

Шеховцов А.В. Інформаційний аспект: розпізнавання образів індивідуума.

Полякова М.В. Определение границ сегмента упорядоченной текстуры на изображении с однородным фоном с помощью многоканального обнаружения пачки импульсов.

Литвиненко В.И. Прогнозирования нестационарных временных рядов с помощью синтезируемых нечетких нейронных сетей

Ковриго Ю.М., Мисак В.Ф., Мовчан А.П., Любицький С.В. Автоматизована система діагностики генераторів електростанцій

Браїловський В.В., Іванчук М.М., Ватаманюк П.П., Танасюк В.С. Керований детектор імпульсного ЯКР спектрометра

Забытовская О.И. Построение функции полезности по экспериментальным данным.

Шиманські З. Апаратні засоби сегментації мовного сигналу

Хобин В.А., Титлова О.А. К вопросу измерения парожидкостного фронта в дефлегматоре абсорбционно-диффузионной холодильной машины (АДХМ)

Фефелов А. А. Использование байесовских сетей для решения задачи поиска места и типа отказа сложной технической системы

Слань Ю. М., Трегуб В. Г. Оперативна нейромережна ідентифікація складних об’єктів керування

Ролик А.И. Модель управления перераспределением ресурсов информационно-телекоммуникационной системы при изменении значимости бизнес-процессов

Кириллов О.Л., Якимчук Г.С., Якимчук С.Г. Изучение электрического поля с помощью датчика измерителя электростатического потенциала на модели замкнутого металлического объема

Грицик В.В. Застосування штучних нейронних мереж при проектуванні комп’ютерного зору.

Гасанов А.С. Информационные технологии построения систем прогнозирования отказов

Шеховцов А.В., Везумский А.К., Середа Е.С. Алгоритм сжатия информации без потерь: модифицированный алгоритм LZ77

Ходаков В.Е., Жарикова М.В., Ляшенко Е.Н. Методы и алгоритмы визуализации пространственных данных на примере моделирования распространения лесных пожаров.

Полякова М.В., Крылов В.Н. Обобщённые масштабные функции с компактным носителем в задаче сегментации изображений упорядоченных текстур. – C. 75 – 84.

Полторак В.П., Дорогой Я.Ю. Система распознавания образов на базе нечеткого нейронного классификатора.

Литвиненко В.И. Синтез радиально-базисных сетей для решения задачи дистанционного определения концентрации хлорофилла.

Бражник Д.А. Управление совмещением изображения объекта в сцене и эталонного изображения.

Бабак В.П., Пономаренко А.В. Локализация места положения сквозных дефектов по сигналам акустической эмиссии.

Мороз В. В. R-D проблема и эффективность систем сжатия изображений.

Крылов В.Н., Полякова М.В., Волкова Н.П. Контурная сегментация в пространстве гиперболического вейвлет-преобразования с использованием математической морфологии.

Квасников В.П., Баранов А.Г. Анализ влияния дестабилизирующих факторов на работу биканальной координатно-измерительной машины.

Казак В.М., Гальченко С.М., Завгородній С.О. Аналіз можливості застосування імовірнісних методів розпізнавання для виявлення пошкоджень зовнішнього обводу літака.

Тищенко И.А., Лубяный В.З. Управление коммутационными процессами в интегрированных сетях связи.

Корниенко-Мифтахова И.К.,Филоненко С.Ф. Информационно-измерительная система для анализа характеристик динамического поведения конструкций.

Тверезовский В.С., Бараненко Р.В. Модель измерителя емкости с линейной шкалой измерений.

Полякова М.В., Крылов В.Н. Мультифрактальный метод автоматизированного распознавания помех на изображении.

Рожков С.О., Федотова О.М. Алгоритм розпізнавання дефектів тканин для автоматичної системи контролю якості.

Бражник Д.А. Использование проективного преобразования для автоматизации обнаружения объектов.

Ходаков В.Є., Шеховцов А.В., Бараненко Р.В. Математичні аспекти створення автоматизованої системи „Реєстр виборців України”