免费 Mermaid 在线画图工具敲三行文本出流程图导出 SVG、复制分享链接不装软件【免费下载链接】mermaid-live-editorEdit, preview and share mermaid charts/diagrams. New implementation of the live editor.项目地址: https://gitcode.com/GitHub_Trending/me/mermaid-live-editorMermaid Live Editor 是一个免费的 Mermaid 在线图表编辑器用文本画图流程图、时序图、甘特图实时渲染在屏幕右侧。它把打开拖拽工具 → 逐块摆位 → 导出图片 → 贴回文档这一串动作压缩成敲几行文本。适合写技术文档、给团队同步方案、在线画时序图不装软件的人。扔掉拖拽画图软件敲三行文本出一张图想画张流程图老流程是这样的打开拖拽工具拖框、连线、一个个对齐导出图片截图再贴回文档。内容改一处整张图重来一遍。发给同事还得附上图片分辨率低了点还被挑。Mermaid Live Editor 把这串流程压缩到写几行文本的粒度。文本就是图改一个字符右侧立刻重画不用点任何刷新。粘贴九行文本在线画时序图不装软件浏览器打开 mermaid.live不注册不安装把这段贴进左侧代码区flowchart TD subgraph 前端 A1[页面] -- A2[状态] end subgraph 后端 B1[接口] -- B2[数据库] end A2 -- B1右边立刻出图subgraph把前后端框成两块节点再多也乱不了。想换时序图把第一行flowchart TD改成sequenceDiagram就行。想画甘特图就换成gantt其余照旧——在线画时序图不装软件这件事核心就是改开头这一行。头部加一行配置切深色主题历史快照自动留 30 份配色文件头部加一行%%{init: {theme: dark}}%%深色立即生效。把dark换成forest或neutral都是现成的图要贴进深浅不一的文档时省事。历史编辑器每 60 秒自动存一版快照最多留 30 份也能手动打标记。关键改动做完给版本起个名回头按名字找那一版逻辑见 src/lib/components/History/historyState.svelte.ts。这些记录只存在你自己浏览器本地不上传别处可参考 src/lib/util/persist.svelte.ts。导出 PNG、SVG、复制免登录查看链接都一键搞定出图动作全收在 Actions 面板实现就在 src/lib/components/Actions.svelte下载 PNG直接当 PPT 插图尺寸可按宽度或高度指定像素值下载 SVG矢量格式放大不糊跨设备跨分辨率都稳复制图片图直接进剪贴板回任意编辑器 CtrlV复制 Markdown按当前文本实时渲染出一段图片写法代码一改图跟着变不用手动重新导出复制查看链接发给同事对方打开就是只读页免登录、免安装这就是免登录查看 Mermaid 图的完整链路复制编辑链接对方接着改再回传一条新链接嵌入代码生成 iframe 或 web component 片段主题、尺寸都能调粘进博客就是一张能缩放、能交互的活图内网访问不了外网一条 docker compose 拉起自己的公司内网出不了外网用仓库自带的 Docker 配置本地起一份docker compose up --build起完浏览器打开 http://localhost:3000和线上是同一套界面文本、导出、分享全都能用。画图这件事从拖拽、导出、截图、粘贴的长流程降到了写几行文本的粒度——图能进 Git、能 diff、能随文档一起版本化。现在粘贴三行文本你文档里的第一张 Mermaid 图几秒就出来了。【免费下载链接】mermaid-live-editorEdit, preview and share mermaid charts/diagrams. New implementation of the live editor.项目地址: https://gitcode.com/GitHub_Trending/me/mermaid-live-editor创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
阅读完成 · 觉得有帮助?