NickName:tjustbecause Ask DateTime:2015-06-11T11:29:46

Springy Cytoscape.js Uncaught TypeError: Cannot read property 'mass' of undefined

I am attempting to use the Springy layout from cytoscape.js to build a new graph from a json file, and I am getting the error Uncaught TypeError: Cannot read property 'mass' of undefined from springy.js 343.

I have 'mass' and a value for 'mass' defined in my json file which I have verified that it is being accessed correctly via console.log, and
I have looked at the source code and from by beginners' understanding of javascript, it should set a default if undefined.

springy.js line 343

Layout.ForceDirected.prototype.eachNode = function(callback) {
    var t = this;
    this.graph.nodes.forEach(function(n){
        callback.call(t, n, t.point(n));
    });
};

Here is my code ...

<html>
<head>
  <title>Springy.js image node demo</title>
</head>
<body>
<script src="jquery-1.11.3.js"></script>
<script src="springy.js"></script>
<script src="springyui.js"></script>
<script src="bluebird.min.js"></script>
<!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>-->

<script/>  

  $.ajax({
    url: 'https://rawgit.com/theresajbecker/CompBio/master/SuperSmallNodes.json',
    type: 'GET',
    dataType: 'json'
  }).done(function(graphP) {  

    for (var i = 0; i < graphP.elements.nodes.length; i++) {  
        var node = graphP.elements.nodes[i].data.id;
        var Nmass = graphP.elements.nodes[i].data.mass;
        console.log('mass');
        console.log(graphP.elements.nodes[i].data.mass);


        console.log('node id');
        console.log(graphP.elements.nodes[i].data.id);
        console.log('station_name');
        console.log(graphP.elements.nodes[i].data.station_name);
    }

    for (i = 0; i < graphP.elements.edges.length; i++) {
        var Nnode = graphP.elements.edges[i].data.source;
        console.log('edges source');
        console.log(graphP.elements.edges[i].data.source);
        console.log('edges target');
        console.log(graphP.elements.edges[i].data.target);
        //console.log(node)
        }

    var graph = new Springy.Graph();




    for ( i = 0; i < graphP.elements.nodes.length; i++) 
                                                     {  
        var NGnode = graph.newNode({ label: 'graphP.elements.nodes[i].data.id'});
                                                     }




    for ( i = 0; i < graphP.elements.edges.length; i++) {  
        var edge = graph.newEdge({source: graphP.elements.edges[i].data.target},
                                 {target: graphP.elements.edges[i].data.target});
    }



$(document).ready(function(){
  var springy = window.springy = jQuery('#springydemo').springy({
    graph: graph,
    nodeSelected: function(node){
      console.log('Node selected: ' + JSON.stringify(node.data));
    },
    repulsion: 500
    }); 

});  


});
</script>
    <div>
<canvas id="springydemo" width="800" height="400" style="border: 1px solid black;"></canvas>
</div>


</body>
</html>

So which part am I misunderstanding?

Copyright Notice：Content Author:「tjustbecause」，Reproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article：https://stackoverflow.com/questions/30771053/springy-cytoscape-js-uncaught-typeerror-cannot-read-property-mass-of-undefine