为什么我的d3映射函数返回未定义的源属性？

Question

I'm new with d3js and I'm having some issues trying to map a csv file to the links of the force layout.

this is my csv file:

node,edges,centrality_degree
1,"[(1, 2), (1, 3), (1, 4), (1, 5)]",1.0
2,"[(2, 1), (2, 3), (2, 4), (2, 5)]",1.0
3,"[(3, 1), (3, 2), (3, 4), (3, 5)]",1.0
4,"[(4, 1), (4, 2), (4, 3), (4, 5)]",1.0
5,"[(5, 1), (5, 2), (5, 3), (5, 4)]",1.0

I want to set the edges values to the links attribute of the d3.layout.force(), however when mapping the values, I'm getting an error:

Uncaught TypeError: Cannot read property 'weight' of undefined

I don't know also if is it correct to return an array with a bunch of objects, that's what I'm getting on the console. 5 arrays with 4 objects each, each object with its source and target attribute. The attributes are all correct, except for the 5 array. I am getting an undefined value for the first source value of it. It was supposed to be 5.

Here is my code:

var force = d3.layout.force()
    .size([w, h]);

d3.csv("{{ g }}", function(d) {

    var nodes = d3.values(d.map( function(d){ return +d.node; } ));

    var links_list = d.map( function(d) {

        list_array = JSON.parse(d.edges.replace(/\(/g,"[").replace(/\)/g,"]"));

        var i, len = list_array.length;

        links = [];

        for (i=0; i<len; i++) {
            links.push({source: list_array[i][0] ,target: list_array[i][1] });
        }

        console.log(links);

        #console result:
        #[Object, Object, Object, Object]
        #[Object, Object, Object, Object]
        #[Object, Object, Object, Object]
        #[Object, Object, Object, Object]
        #expanding one array:
            #0: Object
            #1: Object
            #2: Object
            #3: Object
        #[Object, Object, Object, Object]
            #expanding the array[5][0] object: 
            #0: Object
                #source: undefined
                #target: 2
                #__proto__: Object

    });

    force
        .nodes(nodes)
        .links(links)
        .start();

...

});

What am I doing wrong and why I'm getting this error?

I appreciate your help.

Answer 1

The values of the source and target attributes should be specified as indexes into the nodes array; these will be replaced by references after the call to force start.

Note that array indices start from 0 and not from 1. But in your data from csv, you have links like (5, 1), (5, 2), (5, 3), (5, 4) and your nodes array has 5 elements only; index of last element would be 4. You should have reduced these numbers to 1 to represent the actual nodes.

For example:

var nodes = [{ name: "A", id: 1},{ name: "B", id: 2}];

Force layout expects the link array as shown below.

var links = [{ source:0, target: 1 }];

Hope you got the problem. You will have to do as shown below to get the actual indices.

 for (i=0; i<len; i++) {
    links.push({source: list_array[i][0]-1 ,target: list_array[i][1]-1 });
 }