Переход от одного принудительно ориентированного графа к другому в d3js

У меня есть два сворачиваемых дерева силы для одних и тех же узлов.

Я не видел примера, как мы можем переходить от одного дерева к другому с переходом узлов и реконструкцией ребер в d3js.

Есть ли способ сделать это?

Другой актуальный вопрос, можем ли мы инициализировать положение каждого узла для принудительно ориентированного графа?

РЕДАКТИРОВАТЬ: вот пример . У меня есть два дерева, ссылка одна, и у меня есть другое дерево с такими же молекулами, но другой древовидной структурой. Я думаю, было бы неплохо, если бы я мог анимировать между разными деревьями для одних и тех же молекул или объектов.


transition d3.js tree force-layout
person whatsnext    schedule 14.01.2014    source источник
comment
Что вы подразумеваете под функцией расстояния? Вы имеете в виду linkDistance или имеете в виду какое-то вычисление, которое вы выполняете в функции tick?   -  person t.888    schedule 15.01.2014
comment
@ t.888, извините за путаницу, функция расстояния - это способ, которым я получаю linkDistance и древовидную структуру, но я чувствую, что linkDistance не очень отличается в направленном графике.   -  person whatsnext    schedule 15.01.2014
comment
Вы можете установить свойства x и y на узлах, чтобы инициализировать их положение до передачи массива узлов в силовой макет, но у меня были проблемы при установке нескольких узлов в одно и то же положение - это сводит график с ума.   -  person t.888    schedule 15.01.2014
comment
Если единственное различие между двумя вашими форсированными макетами - это функция, которую вы используете для оценки linkDistance, то вы можете просто поменять эту функцию на другую в одном макете.   -  person t.888    schedule 15.01.2014
comment
@ t.888 две древовидные структуры очень разные. Итак, необходим переход реконструкции краев, в основном два файла json.   -  person whatsnext    schedule 15.01.2014
comment
Это может быть сложно. Вы могли бы сделать собственный переход в функции тика, рассматривая разницу между старыми и новыми позициями как векторы, а затем перемещая точки линии вдоль этих векторов с течением времени.   -  person t.888    schedule 15.01.2014
comment
Похоже, это будет стандартный переход. Было бы полезно, если бы вы могли опубликовать конкретный пример.   -  person Lars Kotthoff    schedule 15.01.2014
comment
@LarsKotthoff Вот пример . У меня есть два дерева, ссылка одна, и у меня есть другое дерево с такими же молекулами, но другой древовидной структурой. Я думаю, было бы неплохо, если бы я мог анимировать между разными деревьями для одних и тех же молекул или объектов.   -  person whatsnext    schedule 15.01.2014
comment
Что-то вроде this в качестве доказательства концепции?   -  person Lars Kotthoff    schedule 15.01.2014
comment
@LarsKotthoff, это почти половина пути. Если исходное положение второй сети может быть предварительно рассчитанным стабильным положением, но не случайным положением, проблема будет решена.   -  person whatsnext    schedule 15.01.2014
comment
Я предполагаю, что у вас может быть второй макет силы в фоновом режиме, который инициализирует другой график. У вас есть пример с двумя такими графами, которые вы бы хотели перенести?   -  person Lars Kotthoff    schedule 15.01.2014
comment
@ user2149631, стабильная компоновка сил - это, по сути, предварительный расчет положений узлов; вам просто нужно будет извлечь значения x и y узлов из стабильного макета и передать те же значения узлам, которые вы хотите предварительно вычислить. Это немного неуклюже, но, вероятно, сработает.   -  person t.888    schedule 15.01.2014
comment
@LarsKotthoff Проверьте файлы 1, 2, для дерева промежуточные узлы значения не имеют. Таким образом, переход применяется только к листовым узлам. Вы можете обнаружить несоответствие между количеством промежуточных узлов двух деревьев.   -  person whatsnext    schedule 15.01.2014
comment
@ t.888, я подумываю использовать sdtp программы компоновки Ифань Ху, чтобы получить файл svg на сервере, а затем прочитать его d3 и обновить ссылки и узлы. Это не очень удобно, так как идентификационные данные узла будут потеряны.   -  person whatsnext    schedule 15.01.2014
comment
Ваш JSON является иерархическим - как вы поместите это в силовой макет?   -  person Lars Kotthoff    schedule 15.01.2014
comment
@LarsKotthoff Следуйте примеру здесь   -  person whatsnext    schedule 16.01.2014
comment
Хорошо, что-то вроде this?   -  person Lars Kotthoff    schedule 17.01.2014
comment
@LarsKotthoff не могли бы вы обновить файлы с помощью 1, 2? Я увидел несоответствие между двумя деревьями. Похоже, вы действительно не используете var force1, просто обновите ссылки.   -  person whatsnext    schedule 17.01.2014
comment
Обновлено - vida.io/documents/Aea4ZgQZ88Fx6AZMu   -  person Lars Kotthoff    schedule 17.01.2014
comment
@LarsKotthoff Возможно ли, чтобы промежуточные узлы появлялись после листьев, а не из верхнего левого угла, а откуда они были?   -  person whatsnext    schedule 22.01.2014
comment
Хорошо, я думаю, здесь у нас есть некоторые особенности. Я не могу дать вам полное решение, особенно если у вас появляются новые запросы каждый раз, когда я обновляюсь. Я действительно считаю, что опубликованный мной пример должен стать для вас хорошей отправной точкой.   -  person Lars Kotthoff    schedule 22.01.2014
comment
@LarsKotthoff Да, я так думаю. Спасибо!   -  person whatsnext    schedule 22.01.2014
comment
Хорошо, тогда я добавлю это в качестве ответа.   -  person Lars Kotthoff    schedule 22.01.2014

Ответы (1)


arrow_upward
8
arrow_downward

В принципе, это следующие шаги.

  • Остановите силовую компоновку, чтобы зафиксировать позиции узлов.
  • Исчезнуть ссылки (например, исчезнуть).
  • Переместите узлы на их новые позиции. Это можно сделать, установив новые позиции в старых данных или полностью изменив данные, а затем используя тот же код, что и в обработчике tick для принудительного макета с переходом
  • Повторно добавьте ссылки.
  • Если в новом макете также используется силовой макет, запустите его.

Я реализовал пример этого здесь. Я использую два набора данных и две силовые схемы. Сначала отображаются только узлы и звенья первого силового макета, а второй работает только в фоновом режиме. Затем первый останавливается, и я выполняю шаги, описанные выше.

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

person Lars Kotthoff    schedule 22.01.2014
comment
... и было бы действительно полезно, если бы человек, проголосовавший против, объяснил, почему этот ответ бесполезен. - person Lars Kotthoff; 23.01.2014
comment
У меня вопрос: нужно ли при обновлении позиций ссылок и узлов поменять галочку у force0 на null? - person whatsnext; 15.02.2014
comment
Нет. Он не будет вызываться, если силовая раскладка остановлена. - person Lars Kotthoff; 15.02.2014