antvis/G6

RangeError: Maximum call stack size exceeded on clone.ts #4824

jsteenkamp posted onGitHub

Describe the bug

Version 4.8.17 Error: Maximum call stack size exceeded

See closed issue #2738.

I am using comboCombined layout

If I do not interact with graph and save using data = graph.save() and then load using graph.read(data) it works, using graph.changeData(data) also works however the graph layout is different as expected.

If I interact with the graph with any events where I change combo/node/edge state and save and then load I get the call stack error. I use item.update( ... ), item.setState( ...), item.clearStates( ... ), item.toFront(), item.toBack() in most interactions.

I tested the data before save using JSON.stringify(data) and this is fine in 1 however for 2 it returns a circular reference error. I have not inspected items in detail but it looks like changing item creates a circular reference, this is a typical error: An error occurred: Converting circular structure to JSON --> starting at object with constructor 'Object' | property '_cfg' -> object with constructor 'Object' --- property 'model' closes the circle

Your Example Website or App

none

Steps to Reproduce the Bug or Issue

none

Expected behavior

Save and load graph data with graph displayed in same state as when saved

Screenshots or Videos

No response

Platform

macOS - latest Chrome - latest

Additional context

No response


I tracked this down to bug in my code where I was updating the item with the item and not the item model:

updateItem({...item, style: { ...style, ...otherStyles}})

should be something like this to set for example opacity

const {styles, ...rest} = item.getModel();
updateItem({...rest, style: { ...style, opacity: 0.5}});
posted by jsteenkamp over 1 year ago

Fund this Issue

$0.00
Funded

Pull requests