Refresh gojs diagram within same DIV

Hello,
I have a ‘script’ tab beside ‘graph’ tab were I am drawing a gojs diagram based on the content in script tab. It works fine for the first time. But while I change something on script tab & click graph tab to see the updated graph, I get Error: Invalid div id; div already has a Diagram associated with it

The graph is drawing with same name and inserting in same div [id=‘graph’]. I am calling same java script function by passing diff values for nodes and links (that I can see from first 2 line at console).

    console.log(JSON.stringify(self.linkDataArray))
    console.log(JSON.stringify(self.nodeDataArray))
    			
    //gojs graph
    var $ = go.GraphObject.make;
    		      
    Diagram =
    $(go.Diagram, "graph",
    {   		        	
      initialContentAlignment: go.Spot.Center,		//display the graph at center initially
      initialAutoScale: go.Diagram.UniformToFill,
      layout: $(go.LayeredDigraphLayout,				//graph layout is Layered
      { direction: 0 }),							//graph will extend towards Right direction
       "undoManager.isEnabled": true,
       "animationManager.isEnabled": true
       });

I have tried with ‘Diagram.div = null’ before Diagram. And logically it is not defined yet, so browser is giving error.
Thanks in advance for the help.

You could try executing this before creating the Diagram:

var graphdiv = document.getElementById("graph");
if (graphdiv !== null) {
    var olddiag = go.Diagram.fromDiv(graphdiv);
    if (olddiag !== null) olddiag.div = null;
}

But I suggest instead of re-creating and re-initializing the whole Diagram each time, that you do it once when you create the tab. Then whenever the script tab changes (or maybe just when the user switches to that tab with the “graph”) you assign Diagram.model.

No improvement! And there are some deprecated error.
e.g; Ignoring get or set of property that has [LenientThis] because the “this” object is incorrect.

The code I gave you obviously doesn’t use this, so that error must be referring to something else. What is issuing that error, and what is it referring to?

Did you step through the code I gave you to see why it isn’t working for you? Perhaps I have a typo in it or are making some wrong assumption about your setup.

It’s reffering to when (graphdiv !== null) comparing, that requires cache clearing every time to fix.

There must be something about the environment or scope of the code in which you are running it. There’s no problem with it if it’s just plain JavaScript code running in a function in a <script> tag.