Как мне помешать JavaScript Infovis Spacetree Spacetree `St.Select ()" метод от рухнувших узлов?

Question

Я использую JavaScript Infovis Toolkit и в частности Спаклетр визуализация.

Мне нужно расширить все дерево, а затем показать путь от определенного узла листьев обратно к корню.

У меня есть дерево, чтобы расширяться просто хорошо, но это выбор узела листьев и подчеркивая путь назад к корне, который вызывает мне некоторые проблемы.

Я использую ST.select(node, onComplete) Функция для выбора узла листьев меня интересует, и действительно, путь назад к корню (линии и узлам) выделены.

Для этого я реализовал onBeforePlotNode а также onBeforePlotLine ST.Controller Методы позволяют мне выделить узлы обратно в корню и их плотлины:

onBeforePlotNode: function(node){  
  //add some color to the nodes in the path between the  
  //root node and the selected node.  
  if (node.selected) {  
    node.data.$color = "#dddddd";  
  } else {  
    delete node.data.$color;  
  }  
},
onBeforePlotLine: function(adj){
  if (adj.nodeFrom.selected && adj.nodeTo.selected) {
    adj.data.$color = "#33CC33";
    adj.data.$lineWidth = 5;
  } else {
    delete adj.data.$color;
    delete adj.data.$lineWidth;
  }
}

Проблема в том, что когда я звоню ST.select() Чтобы выделить узел листьев всех дочерних узлов под этим уровнем, рухнут / скрыт.

Чтобы увидеть это в действии, я загрузил пару примеров:

Полное расширение дерева - лист не выбран
Выбранный лист - путь показан, но все дети ниже узла N2 отсутствуют

Вам может потребоваться прокрутить вниз, если ваше окно браузера немного мало.

Итак, мой вопрос, как я могу показать узлы из узла листьев обратно в корневой узел в JavaScript Infovis без разрушения детей 3-х годов (уровень 1, являющийся корнем)?

Если бы был способ найти мой листный узел и идти на дерево обратно в корню (настроив стили в пути), тогда я бы слушал это

Answer 1

Хорошо, после копания все этот код, загромождая его с помощью Console.log () вызовов и точек останова, я нашел его.

Это связано с наличием onClick Позвоните, тот факт, что график в качестве цикла обновления, который работает на заднем плане и тот факт, что все кроме onClick кажется, игнорирует busy состояние графика.

Что просходит

1. onClick вызывается и запускает цепочку событий, часть из них асинхронно
2. select называется, что более или менее синхронно и делает свою работу
3. onClick наконец сделано, и один из него побочных эффектов состоит в том, что он повторно расширяет график
4. select Установлено clickedNode и сейчас onClick использует вновь устанавливать его и винты вверх

Решение

Нам нужно переделать select Так что это уважает занятое состояние графика:

select: function(id, onComplete) {
    var that = this;
    if (this.busy) {
        window.setTimeout(function() {
            that.select(id, onComplete);

        }, 1);
        return;
    }
    // original select code follows here (remove the old var that = this; assignment)

Вот и все, мы просто проверяем для занятого состояния и задержка, пока не будет falseОтказ Это также следует применять ко всей другой функции, кроме onClick которые называются снаружи, дизайнер библиотек здесь сделал плохую работу по указанию, что имеет побочные эффекты и то, что не так.

Answer 2

Вы пробовали настроить «Snasted: false» в свойствах St? Это решило это для меня.

http://thejit.org/static/v20/docs/files/visualizations/spacetree-js.html.