Графическое дерево JavaScript с Layout
ОГЛАВЛЕНИЕ
Компонента Tree (Дерево) в JavaScript, которая реализует алгоритм разметки J.Q.Walker II .
Рисунок 1. Пример с конкретными цветами, обработанными при помощи VML в Internet Explorer.
Рисунок 2. Пример с конкретными цветами, обработанными при помощи холста (canvas) в Firefox.
Рисунок 3. Пример, демонстрирующий свернутые и выбранные узлы, обработанные посредством VML в Internet Explorer.
Введение
Данная статья представляет компоненту в JavaScript, которая обрабатывает дерево используя VML (Vector Markup Language) в обозревателе Internet Explorer 6+ или элемент <canvas> в Firefox 1.5+.
Существует множество доступных элементов дерева в JavaScript, и большинство из них имеют лучшую совместимость среди обозревателей, работают быстрее и более оптимизированы. Целью данного кода является предоставление реализации клиентской стороны алгоритма разметки Walker, не имея при этом оптимизаций кода. Вкратце, пример - лучше, чем просто абстрактный алгоритм.
Одним из классических компонент представлений дерева JavaScript является дерево Geir Landr: невероятно и просто. Также есть компоненты горизонтальных деревьев навигации JavaScript, основанных на DTree, которые используют HTML-таблицы для обработки дерева в горизонтальном направлении. Множество функций примера данной статьи копируют те, что представлены в таких компонентах.