Представление json для силовых сетей d3

Question

Я пытаюсь сделать визуализацию сети RISK. Вы можете просмотреть его с нужным кодом на http://bl.ocks.org/4683850.

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

{
    "source": 1,
    "target": 0,
    "value": 5
} 

Что нужно сделать с кодом d3, чтобы соединение определялось по именам узлов? Вход будет тогда:

{
    "source": "WesternAustralia",
    "target": "NewGuinea",
    "value": 5
} 

Всякий раз, когда я пытаюсь это сделать, я получаю следующую ошибку:

Uncaught TypeError: Cannot call method 'push' of undefined 

Answer 1

Документы D3 предоставляют объяснение того, как работают ссылки:

https://github.com/mbostock/d3/wiki/Force-Layout

Короче говоря, массив ссылок может содержать индексы для source а также target, которые переназначаются на объекты из nodesили они содержат ссылки на объекты из nodes самих себя. Вам нужно переназначить ваши ссылки source а также target к объектам из nodes,

Предполагая ваш source а также target свойства используют имена, как показано во втором примере выше, вы можете добавить следующий фрагмент в начало вашего d3.json обратный вызов, чтобы сделать переназначение:

    var nodeMap = {};
    graph.nodes.forEach(function(x) { nodeMap[x.name] = x; });
    graph.links = graph.links.map(function(x) {
      return {
        source: nodeMap[x.source],
        target: nodeMap[x.target],
        value: x.value
      };
    });