D3 force layout – linking nodes by name instead of index

by

Here is a straightforward way to do this:

var edges = [];
json.Links.forEach(function(e) {
    var sourceNode = json.Nodes.filter(function(n) {
        return n.Id === e.Source;
    })[0],
        targetNode = json.Nodes.filter(function(n) {
            return n.Id === e.Target;
        })[0];

    edges.push({
        source: sourceNode,
        target: targetNode,
        value: e.Value
    });
});

force
    .nodes(json.Nodes)
    .links(edges)
    .start();

var link = svg.selectAll(".link")
    .data(edges)
    ...

Here is a working PLUNK. (You should fork it to be safe, in case I inadvertently delete it.)

More Related Contents:

  1. variable scope in d3 javascript
  2. d3.json method doesn’t return my data array
  3. Generate (multilevel) flare.json data format from flat json
  4. How to convert to D3’s JSON format?
  5. D3 – how to deal with JSON data structures?
  6. d3 js – loading json without a http get
  7. Passing data from Django to D3
  8. How to get the total depth of an unknown JSON hierarchy?
  9. Convert JS object to JSON string
  10. Post data to JsonP
  11. How to send JSON instead of a query string with $.ajax?
  12. Browser-native JSON support (window.JSON)
  13. Chrome sendrequest error: TypeError: Converting circular structure to JSON
  14. JSON.stringify doesn’t work with normal Javascript array
  15. Console.log showing only the updated version of the object printed
  16. How to convert raw javascript object to a dictionary?
  17. How to search JSON tree with jQuery
  18. How do I persist a ES6 Map in localstorage (or elsewhere)?
  19. Javascript find json value [duplicate]
  20. Parsing JSON from XmlHttpRequest.responseJSON
  21. Creating a table linked to a csv file
  22. Express and ejs
  23. Separate Angular2 TypeScript files and JavaScript files into different folders, maybe ‘dist‘
  24. D3 Bar Graph example not working locally
  25. Chrome and IE sorts JSON Object automatically, how to disable this?
  26. JSON.stringify output to div in pretty print way
  27. XML parser for JavaScript [closed]
  28. Recursive tree search in a nested object structure in JavaScript
  29. Show values on top of bars in a barChart
  30. D3.js: Position tooltips using element position, not mouse position?

Leave a Comment