Uncaught RangeError: Maximum call stack size exceeded

[controversial]

I sometimes get an Uncaught RangeError: Maximum call stack size exceeded in my network, which freezes the whole thing until the page is refreshed. It's possibly related to this, which describes a similar issue with binding click events. This is present on both safari and chrome.

This issue often occurs when creating duplicate nodes, which does produce an intended error, but sometimes also produces this RangeError, which freezes execution completely.

[AlexDM0]

Hi,

It would be great if you can make a jsbin so we can reproduce this.

Cheers

On 01 Feb 2016, at 21:01, Luke Deen Taylor notifications@github.com wrote:

On chrome, I sometimes get an Uncaught RangeError: Maximum call stack size exceeded in my network, which freezes the whole thing until the page is refreshed. It's possibly related to this, which describes a similar issue with binding click events. I haven't seen this on Safari, only Chrome.

—
Reply to this email directly or view it on GitHub.

[controversial]

Hold on a second...

[controversial]

My code is on github here. A live example is at http://luke.deentaylor.com/wikipedia/. If you visit the page in Chrome, you will occasionally encounter a RangeError, especially when opening nodes like "List Of ...".

[AlexDM0]

Take your time. I'll be back from holidays next week. Is this also happening in older versions? Which version are you using?

Cheers

On 01 Feb 2016, at 21:05, Luke Deen Taylor notifications@github.com wrote:

Hold on a second...

—
Reply to this email directly or view it on GitHub.

[controversial]

I'm using a version which I downloaded early saturday. Has it changed in the last 2 days?

[AlexDM0]

Actually, a new version was released today. Can you try that?

On 01 Feb 2016, at 21:09, Luke Deen Taylor notifications@github.com wrote:

I'm using a version which I downloaded early saturday. Has it changed in the last 2 days?

—
Reply to this email directly or view it on GitHub.

[controversial]

Yes, I will.

[controversial]

Sorry, with the latest version it's still an issue. It took me a while to encounter it again, but it's still there. There are some errors on my side, but this appears to be an error in vis.js. It might only be occurring when I try to create a duplicate node.

[controversial]

Turns out it's not just chrome, I see this behavior in Safari as well. My mistake.

[josdejong]

Good to know that it's probably happening in all browsers.

How can we reproduce your issue? The stack trace of the Error in your screenshot gives a little clue but it seems to be some older versions of vis.js.

[controversial]

I believe I am using the latest version of vis. I frequently get the error
when trying to add duplicate nodes. In my code, there was a rare case in
which it might attempt to add two of the same node. I've removed that, and
haven't encountered the error since. However, the error causes the whole
page to freeze completely, so should be fixed.

On Tue, Feb 2, 2016 at 3:54 AM Jos de Jong notifications@github.com wrote:

Good to know that it's probably happening in all browsers.

How can we reproduce your issue? The stack trace of the Error in your
screenshot gives a little clue but it seems to be some older versions of
vis.js.

—
Reply to this email directly or view it on GitHub
#1625 (comment).

[josdejong]

Can you create a jsbin to demonstrate the issue? If we can't reproduce it we can't fix it.

[controversial]

Sure, I'll try and find some time tonight.

On Tue, Feb 2, 2016 at 7:16 AM Jos de Jong notifications@github.com wrote:

Can you create a jsbin http://jsbin.com/?html,js,output to demonstrate
the issue? If we can't reproduce it we can't fix it.

—
Reply to this email directly or view it on GitHub
#1625 (comment).

[patrickmcelwee]

It took me a while, but I finally figured out the minimum to recreate this error in this jsbin: http://jsbin.com/kaxejaf/edit?html,js,console,output

We've been getting this due to using the angular-visjs library. That angular-visjs library makes a call to network.setOptions, which resets the radius of node shapes to undefined by forcing this line of code to rerun:

vis/lib/network/modules/components/nodes/util/NodeBase.js

Line 10 in 0666cb1

this.radius = undefined;

- NOTE that this line of code runs once before, presumably when the network is initialized, but is followed by other code that generates reasonable values the first time around. This other code does not run the second time around.

This then causes several calculations, including the calculation of size, x, and y to be NaN, leading in an infernal spiral to the "Maximum call stack exceeded".

Some interesting things to note:

1. this doesn't seem to happen if the nodes are inserted by calling nodes.update() after the network is initialized but before the call to network.setOptions()
2. this doesn't happen if the shape option is not set on the global nodes option
3. this doesn't happen if avoidOverlap is not specified.

I suppose this could be a bug in the angular library, but I thought it was more likely that my jsbin (which does not use angular at all) should not error out.

[patrickmcelwee]

Also, there have to be at least 2 nodes in the graph to cause the error; no edges required.

[mojoaxel]

@patrickmcelwee Thanks for the detailed analysis. I'll debuged the problem a little using your example:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script type="text/javascript" src="../../dist/vis.js"></script>
  <link href="../../dist/vis.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="network" style="border:1px solid black;"></div>
<script type="text/javascript">
var data = {
  nodes: new vis.DataSet([
    { id:1, label:"111111111" },
    { id:2, label:"222222222" }
  ])
};
var options = {
  width: '100%',
  height: '500px',
  nodes: {
    shape: 'ellipse'
  },
  physics: {
    barnesHut: {
      avoidOverlap: 1
    }
  }
};
var container = document.getElementById('network');
var network = new vis.Network(container, data, options);
network.setOptions(options);
</script>
</body>
</html>

I'll think I found the problem. First the Shapes get initialized, then the options get applied. If the options overwrite the default shape (here with shape: 'ellipse') the shape gets reinitialized what resets radius to undefined. The PhysicsEngine is still working and tries to calculate the new distance of the reshaped nodes. If avoidOverlap is set the PhysicsEngine needs the radius of the shape for calculations. This fails bevor first resize what ends up in a endless loop because the distance can not be calculated properly.

With #2005 I provides a fix for this.

[controversial]

Nice.

[mojoaxel]

Nice.

@controversial Still not in master. But it will be in v4.17

[controversial]

Ok. No rush. Glad to see vis has some active development now.
On Mon, Oct 17, 2016 at 9:29 AM Alexander Wunschik notifications@github.com
wrote:

Nice.

@controversial https://github.com/controversial Still not in master.
But it will be in v4.17

—
You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub
#1625 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AJ5YrzIfXC-Dk5UFk9NGAroqgf2rmiLjks5q03gtgaJpZM4HQ3cJ
.