Rendering order of nodes and edges

hello,
I have encountered the problem of node-side rendering order when using the newer version of gojs (version 2.1.11).
It will appear that the edge is rendered first, and then the page flashes to continue rendering. Of course, there will be slight changes in the edge (using the previous version, the same code does not happen), please show the following video or image:[视频]



Please point me out
thanks

I’m sorry, but I do not understand what the problem is.

Use the sankey layout to load the data, and then the page will render the edge first, and then the page flashes before displaying the node. I want to display it together, instead of rendering the edge first while displaying the bode. The picture describes the layout calculation to complete the display process can be imagined as each frame of the video … I do n’t know why I ca n’t upload the video, sorry

I still do not see the behavior that you are seeing when I load this page:

When I see the page, it seems to draw everything within the diagram at once.

The page does layout some of the HTML elements first, because it takes time to load and run the scripts.

By looking at your reply, I guess it is because my node is bound to too much calculation logic, causing the node rendering after the edge rendering? Is my conjecture true? I’m following up on the problem, I thought it was a problem caused by certain parameters
thank you for your reply!

Unless you are explicitly making changes to nodes after everything has loaded, no, everything should be drawn at once. And perhaps many times if initial animation is enabled. It’s hard to tell without a lot more information.

After initializing the data, I added a listener function. Will it affect the style modification? code show as below:

     myDiagram.addDiagramListener("ViewportBoundsChanged",function(e){

          if(myDiagram.scale > 0.5){
            
                myDiagram.nodes.each(function(node){
                  var entity_img= node.findObject("entity_img");
                  if(entity_img !== null) {
                        entity_img.opacity = 1
                   }
                   
                 
                })
                myDiagram.links.each(function(node){
                      var edge_text= node.findObject("edge_text");
                      edge_text.opacity = 1        
                })
           }
      })

thanks!

That code will only have an effect if those named GraphObjects have an opacity other than 1.0.

But I must comment that such code really seems wasteful after the first use – tthe listener may get called frequently. Why bother trying to change those objects’ opacity after you have already reset them?