Как добавить атрибут в поле данных узла в cytoscape.js? - PullRequest
Новая
       47

Как добавить атрибут в поле данных узла в cytoscape.js?

2 голосов
/ 28 октября 2019

Я пытаюсь динамически обновлять узлы моего объекта cy с помощью поля «parent». Когда элементы впервые загружаются из файла json, у них нет родительского поля. Документация говорит, что я должен иметь возможность установить конкретное поле данных просто с помощью cy.data( name, value ). Однако, похоже, работает только то, что имя атрибута уже существует.

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

1 Ответ

1 голос
/ 28 октября 2019

Я попробовал это с моим кодом и заставил его правильно работать с .move (): 

var cy = window.cy = cytoscape({
  container: document.getElementById('cy'),
  style: [{
      selector: 'node',
      style: {
        'label': 'data(id)'
      }
    },
    {
      selector: 'edge',
      style: {
        'curve-style': 'bezier',
        'target-arrow-shape': 'triangle'
      }
    }
  ],
  elements: {
    nodes: [{
        data: {
          id: 'a',
          parent: ''
        }
      },
      {
        data: {
          id: 'b',
          parent: ''
        }
      },
      {
        data: {
          id: 'c',
          parent: ''
        }
      },
      {
        data: {
          id: 'd',
          parent: 'p'
        }
      },
      {
        data: {
          id: 'p',
          parent: ''
        }
      }
    ],
    edges: [

    ]
  }
});

cy.bind('click', 'node', function(evt) {
  evt.target.move({
    parent: cy.getElementById('p').id()
  })
});
body {
  font-family: helvetica neue, helvetica, liberation sans, arial, sans-serif;
  font-size: 14px;
}

#cy {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
}

h1 {
  opacity: 0.5;
  font-size: 1em;
  font-weight: bold;
}
<head>
  <title>cytoscape-add-attribute demo</title>
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
  <script src="https://unpkg.com/cytoscape/dist/cytoscape.min.js"></script>
</head>

<body>
  <h1>cytoscape add-attribute-demo</h1>
  <div id="cy"></div>
</body>

В документации есть две версии .data (), одна для основного элемента cy, другая для любого элемента, а также узлы, ребра, холст ...

Я думаю, что ваша проблема возникла из-за того, что если нет, дайте мне знать, какой именно код вы используете: D THX

...