Always-visible node labels inside the node shape

[AlinaT389]

Hi,
I’m trying to display node labels permanently, not only on hover, and to have them rendered inside the node itself, e.g. inside a rectangular shape with rounded corners (see images below for what I mean).
I’d also like to support multi-line labels for longer node names.
So far, I’ve tried implementing this using nodeCanvasObject() (Text as nodes), where I draw the background and the text manually. It looks correct visually, but then ForceGraph no longer recognizes these as real nodes. Because of that, built-in features like onNodeHover() and onLinkHover() no longer work as expected.

My question:
Is there already a built-in or recommended way to achieve this?
Or would it be possible to add such an option in the future, something like always-visible labels inside customizable node shapes (e.g., rounded rectangles) that still support the default interactions?
Examples (what I mean):
✅ Correct (expected behavior)

❌ Wrong (current label rendering)

Thanks in advance and thanks for maintaining this great library!

[vasturiano]

@AlinaT389 thanks for reaching out.

If the issue you're having is about pointer events not being tracked correctly around the new shapes you've drawn, you should look at the nodePointerAreaPaint method.

This is also what is used in the "Text as nodes" example:

force-graph/example/text-nodes/index.html

Lines 34 to 38 in df18bc0

	.nodePointerAreaPaint((node, color, ctx) => {
	ctx.fillStyle = color;
	const bckgDimensions = node.__bckgDimensions;
	bckgDimensions && ctx.fillRect(node.x - bckgDimensions[0] / 2, node.y - bckgDimensions[1] / 2, ...bckgDimensions);
	});