svg元素之间的连接

发布于 2024-12-25 12:43:18 字数 300 浏览 0 评论 0原文

有没有办法连接 svg 中的 2 个元素来实现像图表一样的“流程图”?我有两个盒子,它们之间有一个箭头,我希望如果我拖动一个盒子,箭头会保持与该盒子的连接。

我发现 SVG 1.1 中有一个针对此功能的 规范但还远未完成。

我找不到任何代码或库可以做到这一点(我认为这不是一个罕见的用例),并且我想确保在开始制作之前没有经过验证的方法可以做到这一点我自己。

谢谢!

Is there a way to connect 2 elements in svg to achieve a "flow chart" like diagram? I have 2 boxes, an arrow between them, and I would like that if I drag one box, the arrow stays connected to the box.

I've founded that there is a spec for this feature in SVG 1.1 but is far from being completed.

I can't find any piece of code or library that does it (and I think it isn't a rare use case), and I would like to be sure that there isn't a proven way of doing it before I start making it myself.

Thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

杀お生予夺 2025-01-01 12:43:18

您可能对 Dracula 图形库感兴趣,它使用 Raphael 并完全按照您的意思操作:

http://www.graphdracula.net /

更新:我以前没有使用过 jquery-svg,但我把一些小东西放在一起,可能会让你继续前进:http://jsfiddle.net/7vJmy/2/

它利用了 jquery-ui 可拖动的优势,但我怀疑有一种更好的方法可以使用 jquery.svganim.js 包来做到这一点包含在图书馆中 - 不管怎样,这是我现在唯一的时间。

另外,如果将来可以的话,请在问题中包含诸如图书馆限制之类的内容,以便您可以从一开始就获得更具体的答案! :) 希望有帮助。

You may be interested in the Dracula Graph Library which uses Raphael and does exactly what you mean:

http://www.graphdracula.net/

Update: I haven't used jquery-svg before, but I put something small together that may get you going: http://jsfiddle.net/7vJmy/2/

It takes advantage of jquery-ui draggable, but I suspect there's a nicer way to do it using the jquery.svganim.js package that's include with the library - anyway, this is all I have time for now.

Also, if you can in the future, include things like library restrictions in the question so you can get more specific answers from the get go! :) Hope that helps.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文