Как анимировать удаление в GoJS при удалении данных узла? - PullRequest
Новая
       23

Как анимировать удаление в GoJS при удалении данных узла?

1 голос
/ 06 января 2020

Я пытаюсь оживить удаление узлов на диаграмме

Я использую этот фрагмент кода из GoJS документов: https://gojs.net/latest/intro/animation.html 

myDiagram.addDiagramListener('SelectionDeleting', function(e) {
  // the DiagramEvent.subject is the collection of Parts about to be deleted
  e.subject.each(function(part) {
    if (!(part instanceof go.Node)) return; // only animate Nodes
    var animation = new go.Animation();
    var deletePart = part.copy();
    animation.add(deletePart, "scale", deletePart.scale, 0.01);
    animation.add(deletePart, "angle", deletePart.angle, 360);
    animation.addTemporaryPart(deletePart, myDiagram);
    animation.start();
  });
});

enter image description here

Для удаления узла я использую myDiagram.model.removeNodeData(node), но это не вызывает событие. Если я удаляю узел вручную с помощью клавиши Del, он работает.

Как вызвать событие при использовании кода для удаления узла, как при использовании myDiagram.model.removeNodeData(node)?

1 Ответ

0 голосов
/ 06 января 2020

Вы правы, myDiagram.model.removeNodeData(node) не будет вызывать это событие. Поэтому вам нужен код, который вызывает myDiagram.model.removeNodeData(node), чтобы вызвать тот же код, что и событие.

Так что возьмите код и поместите его в свою собственную функцию для более общего использования: 

function animateDeletion(part) {
  if (!(part instanceof go.Node)) return; // only animate Nodes
  var animation = new go.Animation();
  var deletePart = part.copy();
  animation.add(deletePart, "scale", deletePart.scale, 0.01);
  animation.add(deletePart, "angle", deletePart.angle, 360);
  animation.addTemporaryPart(deletePart, myDiagram);
  animation.start();
}

myDiagram.addDiagramListener('SelectionDeleting', function(e) {
  // the DiagramEvent.subject is the collection of Parts about to be deleted
  e.subject.each(function(part) {
    animateDeletion(part);
  });
});

Затем вы можете вызвать этот код перед вызовом removeNodeData: 

  // ... elsewhere...
  animateDeletion(node);
  myDiagram.model.removeNodeData(node.data);
...