在 SVG 中围绕 DndTree 中的标签绘制矩形（D3 树图）

Question

I've found this great piece of code, which I'd like to use in my hobby project: http://bl.ocks.org/robschmuecker/7926762

I'd like to draw rectangles around the nodes (and color them, which wil have different meanings).

I've found this question: How can I draw a box around text with SVG? I changed it to operate on classes and added this piece of code at the end of update() method: add_bounding_box('nodeText');

The following happened:

Also it had issues when I was trying to close the nodes, being duplicated.

I've tried to reach out the developer to help me with this feature, but he hasn't yet answered me.

Answer 1

I was able to do what I wanted by slightly modifying the above linked code. So, in the current case there wasn't any problem with the transformation, because I added the element already as the child of the transformed element.

The issue was that the linked question sets attribute X and Y to some number, which shouldn't be happening in my case. I've stripped those attributes.

Also I had to take into account that it's zoomable, so I had to divide width/height by the scale count.

Finally I just had to take care whether the item was left or right aligned, but that's actually trivial.