嵌入式系列插件第五弹:可交互 SVG

嵌入式系列又来了!!不过这次稍微有点不同,是一个辅助性的插件,用来进一步提升嵌入式系列的体验。之前发布的「嵌入式系列」Excalidraw/draw.io 插件,其实有着诸如 跳转链接/嵌入网页 等等交互功能,但是前面的嵌入式系列插件只有在编辑窗口/灯箱中才能用得到这些交互功能,其实导出的 SVG 本身是可以做一些动画和交互的,只是由于思源统一将 SVG 以图片形式加载的缘故,使得这些交互功能没法在思源的文档中直接使用。这次发布的插件是「嵌入式系列」可交互 SVG,它可以让 SVG 图片变得可交互,只需右键切换到 SVG 交互视图即可。

image.png

https://github.com/YuxinZhaozyx/siyuan-embed-interactiveSVG

「嵌入式系列」思源插件 QQ 交流群:1037356690

嵌入式系列插件的宗旨:仅作为思源笔记的辅助编辑插件,将所有信息嵌入思源笔记和 markdown 所支持的数据格式中,使得插件所创造的所有内容在脱离插件甚至脱离思源笔记(导出为 markdown/分享到第三方平台)后仍然可以正常显示。

秉承嵌入式系列插件的宗旨,这个插件并不会修改 SVG 的内容,不需要时可以随时关闭/卸载,没有任何使用负担。

使用效果

本插件可搭配「嵌入式系列」Excalidraw/draw.io 插件使用,使得生成的 SVG 图像的链接/嵌入网页变得可交互。但其实也不只限定于「嵌入式系列」生成的图像,而是对任意来源的 SVG 图像都可用,在某种程度上,甚至可以作为一种特殊的挂件,欢迎大家挖掘出它的更多玩法。

下面是与 Excalidraw 配合使用的演示视频:

除此之外还可以让 Excalidraw/draw.io 中的链接可跳转。

功能

  • 无网络离线使用
  • 让思源笔记中的 SVG 图像变得可交互

如有更多需求/建议欢迎在 GitHub 仓库中提 issue 或在本贴中回复

使用指南

切换 SVG 交互视图: 点击图像右上角的菜单按钮,当图像被识别 SVG 图像时,菜单中会显示 开启/关闭SVG交互视图 的选项,点击即可将 SVG 图像切换为可交互的 SVG 图像。

如果你觉得有用,欢迎请我喝杯咖啡☕
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    28446 引用 • 119783 回帖
  • 插件
    116 引用 • 753 回帖 • 3 关注
1 操作
yuxinzhao 在 2025-12-05 15:50:12 更新了该帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • yuxinzhao

    可以试试,等我消息

  • 其他回帖
  • wujianzhong 1 评论

    相当优秀,建议增加快捷键和文档最大宽度限制显示,随文档显示区域变化而变化

    感谢反馈,文档最大宽度限制加上了
    yuxinzhao
  • queguaiya 1 2 赞同 5 评论

    养成了看到嵌入式就点赞的习惯

    感谢支持
    yuxinzhao
    @yuxinzhao 这个转化是持久化的吗,如果是的话,感觉能拿来干很多事
    queguaiya
    @queguaiya 得看你怎么理解持久化,这个插件不会向笔记中插入任何数据,只是将 SVG 图片从只会静态显示的 img 标签转换到可动态交互的 object 标签,你理解的数据应该全部嵌在 SVG 里,这就得靠其他的嵌入式系列插件/其他带有嵌入 SVG 功能的软件。不过,倒是有几种特殊用法,比如 Excalidraw 里面可以嵌入 iframe,就像上面视频里演示的那样,这个操作空间是很大的,比如其他的插件/挂件如果采用 iframe 进行实现,理论上是可以在图片里直接使用这些插件/挂件。还有如果有个人网页想要把其中的某些动态更新的内容展示在文档里,也可以做到文档里实时(伪)同步更新了。
    yuxinzhao
    @yuxinzhao 我的意思是,转换一次后,下次重新打开还需要重转换吗
    queguaiya
    @queguaiya 不需要每次重新转换,开关是有记录的
    yuxinzhao
  • 优秀!

  • 查看全部回帖