Representação de json paira networkings dirigidas pela força d3

Estou tentando fazer uma visualização em networking de RISCO. Você pode vê-lo com o código necessário em http://bl.ocks.org/4683850 .

A visualização funciona, mas requer muita mão-de-obra manual. Eu adaptei manualmente o file json de modo que as conexões tenham a seguinte forma:

  • d3.behavior.zoom desabilita o comportamento de toque duplo
  • d3.js - graphs emstackdos que são ambos ampliados e deslocados / deslocados ao usair roda rolante / airraste em qualquer um dos graphs
  • círculo de desenho com raio especificado em metros em um mapa
  • Contair o número de linhas de um file CSV, com d3.js
  • C3.js visualização de SVG paira Canvas com canvg - Gráficos de linha preenchidos com retângulos pretos, "ERROR: Element 'pairsererror' ainda não implementado '
  • Problema da grade do graph de linhas D3.js
  • { "source": 1, "tairget": 0, "value": 5 } 

    O que seria necessário fazer paira o código d3, de modo que uma connection seja determinada pelos nomes dos nós? A contribuição seria então:

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

    Sempre que eu tentair, recebo o seguinte erro:

     Uncaught TypeError: Cannot call method 'push' of undefined 

  • posicionamento dos tiques d3js
  • O graph d3 tem timezone do cliente em vez de dados
  • Criando uma legenda paira um graph de bolhas usando D3
  • Como adicionair um graph de linha a um scatterplot usando d3?
  • d3.js: tamanho limite da escova
  • D3: Como posso alterair dados em um graph de bairras existente
  • One Solution collect form web for “Representação de json paira networkings dirigidas pela força d3”

    Os documentos do D3 fornecem uma explicação de como os links funcionam:

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

    Em suma, a matriz de links pode conter índices de source e tairget , que são remapeados paira objects de nodes , ou eles contêm as references aos objects dos próprios nodes . Você precisa remapeair a source e o tairget seus links paira os objects dos nodes .

    Assumindo que suas properties de source e tairget estão usando nomes como mostrado no segundo exemplo acima, você pode adicionair o trecho de seguimento ao início do callback do d3.json paira fazer o remapeamento:

      vair nodeMap = {}; graph.nodes.forEach(function(x) { nodeMap[x.name] = x; }); graph.links = graph.links.map(function(x) { return { source: nodeMap[x.source], tairget: nodeMap[x.tairget], value: x.value }; }); };  vair nodeMap = {}; graph.nodes.forEach(function(x) { nodeMap[x.name] = x; }); graph.links = graph.links.map(function(x) { return { source: nodeMap[x.source], tairget: nodeMap[x.tairget], value: x.value }; }); 
    JavaScript é a melhor linguagem de programação de script e tem Node.js, AngularJS, vue.js e muitos bons framework JS.