嵌入式系列插件第四弹:Excalidraw 插件

继上一篇 嵌入式系列插件第三弹:draw.io 插件 之后,收到评论区中的朋友有 Excalidraw 的需求,于是第四个「嵌入式系列」插件 Excalidraw 插件诞生了。(注意名字里带「嵌入式系列」)

image.png

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

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

秉承 「嵌入式系列」 的宗旨,新的 Excalidraw 插件以 SVG/PNG 图像的形式 存储 Excalidraw 数据,因此对于思源笔记和 markdown 以及其他第三方平台而言,文章中的 Excalidraw 图像真的就只是一张普通的 SVG/PNG 图片,在任何地方都可以正常显示、正常分享。甚至单独将图片转发给别人,别人如果将其导入思源并安装这个插件,或者直接导入 Excalidraw 平台,照样可以接着编辑,实现自由编辑、自由分享。

PC 端使用效果

preview.png

移动端使用效果

image.png

功能

  • 无网络离线使用
  • Excalidraw 图像以 SVG/PNG 格式存储
  • Excalidraw 图像可编辑
  • 支持导出 PDF
  • 支持移动端编辑
  • 图像支持暗黑模式
  • 支持 Excalidraw 中显示思源文档内容

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

使用指南

设置存储格式:可在插件配置中设置新创建的 Excalidraw 图像以 SVG 还是 PNG 格式存储。

创建 Excalidraw 图像: 在编辑器中输入 /excalidraw 命令即可创建新 Excalidraw 图像。

编辑 Excalidraw 图像: 右键/点击图像右上角的菜单按钮,当图像被识别为合法的 Excalidraw 图像时,菜单中会显示 编辑Excalidraw 的选项,点击即可打开编辑窗口。

Excalidraw 图像块标签: 可在插件设置中修改 Excalidraw 图像块的标签显示模式。

嵌入思源内容: 点击思源文档/思源块左侧按钮,点击 复制 - 复制块超链接,得到以 siyuan://blocks/ 开头的超链接,在 Excalidraw 中点击 嵌入网页, 输入该超链接,即可将思源内容嵌入到 Excalidraw 中。

从其他来源迁移:

  • 方案 1:只需要在任意 Excalidraw 平台导出 SVG/PNG 图像时勾选 包含画布数据 选项,再把 SVG/PNG 图像拖入思源笔记中即可,不用担心以后没法再迁移,这个 SVG/PNG 图像也是可以导入到任意 Excalidraw 平台再次编辑的。
  • 方案 2:在任意 Excalidraw 平台内复制全部内容,在思源笔记中输入 /excalidraw 命令创建新 Excalidraw 图像,然后将复制的内容粘贴进弹出 Excalidraw 窗口中即可。

已支持在 Excalidraw 中嵌入思源块和思源文档。

Excalidraw 的可玩性其实蛮高的,比如可以画出粗略的思维导图后在 Excalidraw 里用脚本直接规范化(看到隔壁 obsidian 有),后面还有得改。如果有需求可以回帖,后面慢慢加。

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

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

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

    28446 引用 • 119786 回帖
  • Excalidraw
    6 引用 • 56 回帖
  • 插件
    116 引用 • 753 回帖 • 3 关注
6 操作
yuxinzhao 在 2025-12-05 15:49:29 更新了该帖
yuxinzhao 在 2025-12-01 00:55:31 更新了该帖
yuxinzhao 在 2025-11-21 00:03:31 更新了该帖
yuxinzhao 在 2025-11-18 15:24:53 更新了该帖 yuxinzhao 在 2025-11-18 15:17:57 更新了该帖 yuxinzhao 在 2025-11-18 15:17:05 更新了该帖

相关帖子

优质回帖

欢迎来到这里!

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

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

    draw.io 和 excalidraw 新版本都可设置默认明暗主题

    1 回复
  • 其他回帖
  • 使用嵌入式 Excalidraw 有一个多月了,在项目中至少产生了将近两百的白板绘图,特别是增加了 Tab 键切换图形 js 脚本之后特别好用,根据我多年来使用 Excalidraw 的情况来看,白板绘图通常有两大类型的存在形式,一是嵌入至文档,关注重点是正式文档交付(导出 PDF 美观)、数据迁移可用(导出 Markdown 可用)、知识分享可用(发布至第三方可用);二是独立白板文件,关注重点是白板之间的双向链链,白板中嵌入文档块,白板中链接至文档等功能从而可以形成体系(随时快速记录灵感,讨论时可快速创建白板辅助梳理和讲解逻辑 / 思路,各白板可以通过双向链接形成体系)、白板可嵌入至文档,方便导出 PDF、知识分享,母白板更新时嵌入式白板同步更新。两者是相辅相成的关系。所以我建议还是在现有嵌入式的基础上增加一个创建文档树白板的功能,创建独立的白板,独立的白板又可嵌入至文档,从而更全面的覆盖应用场景。实际上独立的白板可以理解为输入,嵌入多白板可以理解为输出,从输入至输出是一个完整的闭环的知识学习过程。

    image.png

  • PearlLin 3 评论

    评论不好分行。另外开一个回复。


    看了一下之前的讨论。嵌入到列表应该是基于思源的列表块,通过插件操作实现。嵌入到图片应该是则是跟前四弹一样,在外部去编辑?(这个我不确定,我比较少用白板)

    image202511181234046n6jrjy.png

    这种用法的基底是列表 +css,这种做法实际受限很大。比如说,样式显示比较随机(A-2 那里,就自动变成上下两行),再比如说,连线上无法添加文字说明。因此,它只能做一些简单的导图。


    “画出粗略的思维导图后在 Excalidraw 里用脚本直接规范化”,我主要是看到这句话萌生的想法:

    1. 在思源里面通过列表块绘制简单的思维导图,然后通过自定义属性对其标记(列表/表格/看板)。
    2. 将整个列表块拖入 Excalidraw 里,通过脚本实现规范化(列表/表格/看板),拿到一个思维导图的基底。
    3. 后继如果有调色、标记、变换样式等需要,就可以通过 Excalidraw 的相关操作实现。
    4. 最后保存为 Excalidraw 的 svg,在思源里嵌入式显示(以及允许后继编辑和更换)。

    感觉跟第三弹中的讨论思路不同,提供出来,算供佬参考的新思路。

    感谢,这个思路应该是可以实现的,可以提供一个类似 TikZ 和伪代码的转换功能,把列表块直接转换为 Excalidraw 思维导图,缺点的话就是这是单向的,这个思路后面可以考虑。
    yuxinzhao
    我的另一个想法是以列表为基础,但是是和思维导图绑定的,列表转换为思维导图后可以在可视化界面里加样式标记调整位置之类的,然后最后还可以转换回普通列表,也就是说思维导图和列表的内容绑定在一起。
    yuxinzhao
    @yuxinzhao 感觉具体实现是自定义块的范畴了。这部分没有了解过。
    PearlLin
  • Sume 4 评论

    大佬,你好,我这两天刚下载这个 whiteboard 插件,正在使用。以下是我的使用问题及建议,看看是否可行:
    1.我在写笔记的时候,有些要点想法下面需要画图,用了 whtieboard 挂机后默认全屏,无法退出全屏。我找了其他帖子才变成窗口模式。参考文档:
    分享 Whiteboard 白板挂件取消全屏
    分享 Whiteboard 白板挂件取消全屏

    建议:能否在白板里加个是否全屏的设置?方便用户自己选择。
    *其实我的想法是默认小窗口,然后双击小窗口上的横栏就自动放大全屏,再双击横栏的话,就恢复上一次的窗口大小。不感觉这样更难实现,还是加个是否全屏设置选项简单一点感觉。

    2.我在画时钟圆的时候,有某小部分需要用绿色表示,其余部分用红色表示,我在工具栏里没有找到填充选项,只好去 index-ZsssFvwm.js 配置里改笔触大小,涂得好辛苦,涂不好看...看着看着就犯强迫症了。

    建议:加个填充的工具,方便填充图案颜色。

    😂 你下载的不是我的插件,我的插件名叫做 嵌入式系列 Excalidraw,不是 whiteboard 挂件
    yuxinzhao
    @yuxinzhao 欸?是哦,刚到挂件市场看了发现挂件发布者名字不是你。。。果咩拿塞!
    Sume
    @yuxinzhao 大佬,你的插件可以嵌入笔记文字下面使用欸,小窗口的。太好了!但是,一个圆只能填充一个背景色,无法将一个圆填充多个颜色,这个能否支持?
    Sume
    @yuxinzhao 大佬,我在使用 嵌入式系列 Excalidraw 的过程中还发现了 2 个问题。 我上面补充了,因为在回复中无法格式输出,分不了段
    Sume
  • 查看全部回帖