Graphviz 聚焦于一个节点
我正在创建一个场景，从 XML 文件（节点+边）创建图形。该图在 iframe 内生成为 SVG。我想要做的是能够单击一个节点并使该节点聚焦（不同的颜色，滚动到位置）。
我得到的是，我在传递给 graphviz 的属性中传递一个 URL，该 URL 在查询字符串中具有焦点节点，因此 my-url.php?focus=2 将焦点节点 id 2。然后，在属性创建期间，我将焦点节点的颜色更改为亮黄色。
问题是我找不到向下滚动到该节点的方法。我必须通过向下滚动手动搜索节点。有没有办法获取焦点节点的坐标并将其传递到托管 iframe 的窗口？这样，我就可以使用 Javascript 向下（或向右）滚动。
有什么想法吗？我并不是在寻找完整的解决方案。如果可行的话，我可以接受一种策略（并且可以在最新的浏览器上运行。它不必向后兼容）。
谢谢。
I'm creating a scenario where I create a graph from an XML file (nodes+edges). The graph is being generated as an SVG inside an iframe. What I want to do is to be able to click on a node and have that node focused (different colour, scrolled into position).
What I've got is that I'm passing a URL in the attributes passed to graphviz that has the focus node in the query string so my-url.php?focus=2 will focus node id 2. Then, during attribute creation, I change the color of the focus node to bright yellow.
The problem is that I can't find a way to scroll down to this node. I have to manually search for the node by scrolling down. Is there a way I can get the coordinates of the node in focus and pass it to the window hosting the iframe? That way, I would be able to use Javascript to scroll down (or right).
Any ideas? I'm not looking for a complete solution. I can live with a strategy if it's feasible (and would work on the latest browsers. It doesn't have to be backward compatible).
Thanks.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以通过调用不带 -T 选项的 dot 来检索 SVG 中节点的位置（它会生成点文件，其中节点用“pos”属性进行注释，指示它们的绘制位置。然后，当 $_GET['focus' ] 是 42（即请求 my-url.php?focus=42），my-url.php 应该生成 Javascript 代码，该代码将使用诸如scrollTo之类的东西将 iframe 滚动到节点 42 的位置（http://stackoverflow .com/questions/1192228/scrolling-an-iframe-with-javascript）。
为了确保即使图像已缩放（它是 SVG，右侧）也能正常工作，您需要将滚动到的位置乘以SVG 的总宽度与由“size”图形属性设置的点图宽度之间的比率（高度相同）。
You can retrieve the position of the nodes in the SVG by calling dot without the -T option (it produces the dot file where nodes are annotated with a "pos" attribute indicating where they are drawn. Then, when $_GET['focus'] is 42 (ie. my-url.php?focus=42 is requested), my-url.php should produce Javascript code which will scroll the iframe to the position of node 42, using something like scrollTo (http://stackoverflow.com/questions/1192228/scrolling-an-iframe-with-javascript).
To ensure that this works even if the image has been scaled (it's SVG, right), you would need to multiply the position to which you scroll by the ratio between the total width of the SVG and the width of the dot drawing as set by the "size" graph attribute (same thing for height).