RU Иерархическая компоновка - Mingun/d3 GitHub Wiki

Вики ▸ Справка по API ▸ Компоновки ▸ Иерархическая компоновка
English | Русский

Иерархическая компоновка является абстрактной компоновкой, которая не используется непосредственно, но вместо этого позволяет совместно использовать код нексольким иерархическим компоновкам. Реализации смотрите в одной из них:

• Кластерная компоновка — кластеризация записей в дендрограмму.
• Компоновка с упаковкой — иерархическая схема с рекурсивной упаковкой кругов.
• Компоновка с разделением — рекурсивное разделение дерева узлов на «солнечные лучи» или «сосульки».
• Древовидная компоновка — аккуратное позиционирование дерева узлов.
• Дендроплан — рекурсивное разделение плоскости для отображения дерева узлов.

Хотя пакетная компоновка и не является иерархической компоновкой, она также спроектирована для работы с иерархиями.

# d3.layout.hierarchy()

Создаёт новую иерархическую компоновку с настройками по умолчанию: порядок сортировки значений по убыванию; функция доступа к значению предполагает, что входные данные являются объектом с числовым атрибутом value; функция доступа к потомкам предполагает, что входные данные являются объектом с атрибутом children, являющимся массивом.

# hierarchy(root)

Выполняет иерархическую компоновку, возвращая массив узлов, ассоциированных с указанным корневым узлом root. Входной аргумент компоновки является корневым узлом иерархии и выходное возвращаемое значение является массивом, представляющим вычисленные позиции всех узлов. Для каждого узла заполняется несколько атрибутов:

• parent — родительский узел или null для корня.
• children — массив дочерних узлов или null для листьев.
• value — значение узла, возвращаемое функцией доступа к значению.
• depth — глубина узла, нумерация начинается с 0 для корня.

Кроме того, многие иерархические компоновки так же рассчитывают координаты x и y для узлов; смотрите реализующие классы для подробностей.

# hierarchy.links(nodes)

С учётом указанного массива узлов nodes, возвращает массив объектов, представляющих связи между родителем и потомком для каждого узла. Листья не имеют никаких связей. Каждая связь является объектом с двумя атрибутами:

• source — родительский узел (как описан выше).
• target — дочерний узел.

Этот метод полезен для получения набора описания связей, пригодного для отображения, часто в сочетании с генератором диагоналей. Например:

svg.selectAll("path")
    .data(partition.links(nodes))
  .enter().append("path")
    .attr("d", d3.svg.diagonal());

# hierarchy.children([accessor])

Если указан параметр accessor, устанавливает функцию доступа к потомкам. Если параметр accessor не указан, возвращает текущую функцию доступа к потомкам, которая по умолчанию предполагает, что входные данные являются объектом с атрибутом children, являющимся массивом:

function children(d) {
  return d.children;
}

Часто удобно загружать иерархию узлов с помощью функции d3.json и представлять входную иерархию вложенными объектами в JSON. Например:

{
 "name": "flare",
 "children": [
  {
   "name": "analytics",
   "children": [
    {
     "name": "cluster",
     "children": [
      {"name": "AgglomerativeCluster", "size": 3938},
      {"name": "CommunityStructure", "size": 3812},
      {"name": "MergeEdge", "size": 743}
     ]
    },
    {
     "name": "graph",
     "children": [
      {"name": "BetweennessCentrality", "size": 3534},
      {"name": "LinkDistance", "size": 5731}
     ]
    }
   ]
  }
 ]
}

Функция доступа к потомкам сначала выполняется для корневого узла в иерархии. Если она вернёт null, это будет означать, что узел является листом и обход компоновки завершается. В противном случае функция доступа должна вернуть массив данных, представляющих дочерние узлы. Функция доступа вызывается с аргументами node и depth.

# hierarchy.sort([comparator])

Если указан параметр comparator, устанавливает порядок сортировки соседних узлов компоновки в указанную функцию сортировки. Если параметр comparator не указан, возвращает текущий порядок сортировки групп, который по умолчанию является убывающим по ассоциированному с входными данными числовому атрибуту value:

function comparator(a, b) {
  return b.value - a.value;
}

Функция сравнения выполняется для пары узлов с передачей в неё входных данных каждого узла. Если функция сравнения установлена в null, это сортировка отключается и используется порядок обхода дерева. Функции сравнения также могут быть реализованы как d3.ascending или d3.descending.

# hierarchy.value([value])

Если указан параметр value, устанавливает функцию доступа к значению. Если параметр value не указан, возвращает текущую функцию доступа к значению. Функция доступа к значению по умолчанию предполагает, что входные данные являются объектом с числовым атрибутом value:

function value(d) {
  return d.value;
}

Функция доступа к значению выполняется для каждого входного элемента и должна возвращать число, представляющее числовое значение узла. Для компоновок, пропорциональных площади, например, «плоских» деревьев, это значение используется для установки площади каждого узла пропорционально его значению; для других иерархических компоновок значение не влияет на компоновку.

# hierarchy.revalue(root)

Повторно вычисляет значения каждого узла в указанном дереве, начинающемся с корня root без повторной сортировки или перевычисления дочерних узлов. Этот метод может использоваться для перевычисления значений каждого узла без структурных изменений в иерархии. Он существует, в первую очередь, для поддержки «липучих» дендропланов.