jsnetworkx.js:5 Uncaught TypeError: Cannot read property 'force' of undefined

[ScientiaEtVeritas]

Hi, I'm trying to draw the graph, but always get this error:
jsnetworkx.js:5 Uncaught TypeError: Cannot read property 'force' of undefined

Even if I try sth. like this:
` G = new jsnx.Graph();

    G.addNode(1);
    G.addNode(2);

    G.addEdge(1,2);


    jsnx.draw(G, {
      element: '#canvas',
      withLabels: false
    });`

Does someone have an idea what's the reason for this?

D3 is included.

Thanks in advance.

[juhojo]

Hey, I was experiencing the same issue and downgrading d3 version was the solution for me.
Try changing you d3 script to this one:
<script src="http://d3js.org/d3.v3.min.js"></script>

[jeffzemla]

Downgrading d3 resulted in a different error for me:

Uncaught TypeError: Cannot read property 'getComputedStyle' of null

I tried implementing ScientiaEtVeritas's example and also some examples from the jsnetworkx.org page.

[juhojo]

Are you certain that you did pass a correct element to the jsnx.draw()- function? getComputedStyle method is used to

give the values of all the CSS properties of an element after applying the active stylesheets and resolving any basic computation those values may contain. MDN - Mozilla Foundation

so it appears to me that the canvas element you have created in your HTML DOM does not have an id canvas, therefore resulting in the compile error.

I cannot provide more suggestions, because I have not yet received a similar error.

[revosys]

i m facing same problem...

[bigbasti]

Downgrading d3 also solved this issue for me

[revosys]

My code is simple.... but still this is the issue...

<script src="//d3js.org/d3.v3.js"></script>
<script src="js/jsnetworkx.js"></script>
<script>

var G = new jsnx.Graph();
G.addNodesFrom([
    [1, {color: 'red'}],
    [2, {color: 'green'}],
    [3, {color: 'white'}]
]);
 
G.addEdgesFrom([[1,2], [1,3]]);
 
// `jsnx.draw` accept a graph and configuration object
jsnx.draw(G, {
  element: '#canvas',
  withLabels: true,
  nodeStyle: {
      fill: function(d) {
          return d.data.color;
      }
  }
});

</script>

<div id="canvas" class="span9"></div>

Error is Uncaught TypeError: Cannot read property 'getComputedStyle' of null
at Array.d3_selectionPrototype.style (d3.v3.js:740)
at Object.i [as draw] (jsnetworkx.js:5)

[bigbasti]

just a wild guess here: shouldn't you declare the div you want to draw in BEFORE drawing on it?
(move the div before the script)

[revosys]

thanks for your reply.... ITS WORKING....:) Thanks

[bigbasti]

i just tried your code - got the same error - moved the div above the script tag and everything ran fine

[revosys]

Yes.... Some time over load work can make you behave like idiot...:)

[snipercup]

I have the same problem. I can downgrade to d3 v3, but then I get the error:
jsnetworkx.js:5 Uncaught Error: D3 requried for draw()

im using <script src="http://d3js.org/d3.v3.min.js"></script>