### 重现步骤 渲染Mermaid流程图的时候 ### 当前行为 1. 流程图内容比较多比较大时,最大的缩放倍数被锁定为3导致无法进一步放大查看 2. 点击下载时下载的图片不是包含完整Mermaid流程图的图片,而是被裁切成当前缩放后可视区域的内容 ### 预期行为 1. 不限制最大缩放倍数 2. 下载的图片能够高清还原完整的流程图不裁切,或者导出出svg文件 ### 上下文 _No response_ ### 版本 2.5.0 ### 您在哪些浏览器上遇到了这个问题? _No response_
Activity
dosubot commentedon Apr 22, 2026
感谢反馈!关于你提到的两个问题,以下是目前的实现情况:
1. 最大缩放倍数被锁定为 3
确认存在此限制。缩放范围
0.5 ~ 3.0是硬编码在Mermaid.tsx中的三个位置 [1] [2] [3],例如:Math.max(0.5, Math.min(3, prev + delta))Math.min(prev + 0.2, 3)Math.max(prev - 0.2, 0.5)目前没有提供 props 来自定义这些上下限。如果要支持更大的缩放倍数,需要将这些值改为可配置的参数。
2. 下载图片被裁切
从代码设计上看,
handleDownload函数(第 205-232 行)是通过获取完整 SVG 元素并用getBoundingClientRect()取其完整尺寸来渲染到 Canvas 上导出 PNG 的 [4]。理论上应该导出完整的图而非可视区域。但这里的问题可能在于:当流程图非常大时,getBoundingClientRect()返回的是 SVG 元素在 DOM 中的实际渲染尺寸(可能受容器裁切影响),而不是 SVG 内容的完整尺寸。这可能是导致导出被裁切的原因。一个更可靠的方式可能是直接读取 SVG 的
viewBox或内部尺寸属性来确定画布大小,或者直接导出 SVG 文件(正如你建议的)。To reply, just mention @dosu.
Share context across your team and agents. Try Dosu.
Div627 commentedon Apr 27, 2026
@ppjjzz 感谢反馈,问题已收到。
我们会评估优化 Mermaid 大图的缩放和导出逻辑,包括放开缩放上限,以及确保下载时导出完整流程图,避免只截取当前可视区域。也会考虑支持 SVG 导出。
ppjjzz commentedon Jul 15, 2026
@Div627 请问有进展吗