从 React Konva 导出 Canvas 到 SVG 和 PDF?

Export Canvas from React Konva to SVG & PDF?

目前,我只能使用 jpeg & png 导出,例如:

stageRef.current?.getStage().toDataURL({ mimeType: 'image/jpeg', quality: 1 })
stageRef.current?.getStage().toDataURL({ mimeType: 'image/png', quality: 1 })

我想将 Canvas 导出到 svg 以及 pdf,就像 Figma 那样。

我发现了 Data URIs which led to MIME_types。在那里,他们写了 application/pdf & image/svg+xml 应该工作但是当我这样做时我仍然得到一个 .png 图像。

有什么方法可以在 Konva 中从 Canvas 实现 .svg & .pdf 吗?

stage.toDataURL() 正在使用 canvas.toDataURL() API 进行导出。大多数浏览器仅支持 jpgpng 格式。

对于 SVG 或 PDF 导出,您必须编写自己的实现。

对于 PDF 导出,您可以使用外部库通过 stage.toDataURL() 方法生成带有图像的 PDF 文件。作为演示,请查看 Saving Konva stage to PDF demo.

Konva 库中没有内置的 SVG 导出方法。您必须编写自己的实现。如果您使用 RectCircleText 等基本形状而不使用任何花哨的过滤器,编写此类转换应该不难,因为 SVG 规范中有类似的标签。