Link vs. Node drawing layers

[fredrikelmegren]

Hi there!

Firstly, thank you for providing this brilliant and flexible package ⭐️

Now, I'm drawing a label on my custom link in linkCanvasObject with linkCanvasObjectMode={() => 'replace'}. However, I would like for the link to be drawn onto the canvas after the nodeCanvasObject has been drawn to avoid it being drawn underneath as per this example:

Is there any way to achieve this already, or would I need to go via nodeCanvasObject and figure out node's parent and draw the link/label there, after the node?

Thanks in advance! / Freddy

[vasturiano]

@fredrikelmegren thanks for reaching out.

In the 2D mode, the links are always drawn onto the canvas before the nodes. The drawing order affects the z-index in the Canvas world, so the intentional result is that the link lines don't show on top of the nodes representation.

This is not customizable, so you can try to solve it by drawing the label associated to the nodes, instead of the links. Or adding transparency to nodes so that you can see-through to the links. Or even resort to onRenderFramePost to draw (external) items after everything else is painted to make sure it shows on top.

[fredrikelmegren]

Thanks for your quick response @vasturiano and for the suggestions!

Just in case it's of interest to anyone else, my solution in the end was to store a reference to a node's parent in the node itself, and draw the link from nodeCanvasObject using node and node.parent as target and source.