Hi, I need to convert the coords of a Graphviz node to a SVG coords in px so I can recenter the viewbox position and zoom to show the node, but I don’t know how to do it, I tried to convert some but this doesn’t work. If you know some other solutions, I listen to it. Thank you for your responses !
How did you convert pt to px & how did it not work?
Hi, so I took the total width and height of the SVG and divided it with the total width and height of Graphviz (in the .dot), in this way I can have a conversion factor that I can apply on the coords of a node (in .dot (TDot)) but this doesn’t work well, and I also inverted the Y axe because in graphviz it is inverted.
My SVG is very rusty, but a quick read of the SVG reference doc & an svg file generated by Graphviz tells me:
- Graphviz sets the default units to points (not px), so no pt-to-px conversion necessary.
- To handle the conversion to “Y down” coordinates, Graphviz just negates its Y value.
Does this help?
It doesn’t work, I have a different size in the .dot and for the SVG, it is similar but not the exact same, X is 109389pt for SVG and 112488pt for graphviz (.dot), so I have no idea how to pan on a certain node with the coords I have in the .dot file. Do you know another solution to add a search bar for nodes and move the viewbox on it and still have the zoom and pan ? (I am using SVG Pan Zoom lib)
What about adding node [id=“\N”] to identify the nodes within the SVG file (id | Graphviz)?
There’s a “-y” command line option to invert the direction of the y axis. That may help.
I’m not sure, but doesn’t d3-graphviz already implement this kind of interaction?
Also, looks like graphviz SVG pan and zoom has worked in Observable but the links to run the demo are broken now.
Thank you all for your responses, I made a different way to do it and it works very well, I used getBBox to find the coordinates of a text in the svg, then I pan to the right coordinates, no need to convert or anything because the coordinates are the same format as SVG.