Suggestion: Save As Svg/Png

[clairernovotny]

Would be really awesome to be able to export a diagram from the preview window as either an SVG or PNG. Both are supported by Mermaid directly.

One request -- possibly a different stylesheet to use for this as I wouldn't want the export to use the dark theme I use in Code.

[vstirbu]

This would be nice although the end result is not really usable till the missing arrow heads issue (#2) is fixed.

[vstirbu]

Export to SVG and PNG is a feature of mermaid cli that requires PhantomJS. I found this dependency quite invasive.

I would be interested in alternatives before moving forward.

[g3o2]

Hmmm, how do you currently draw the diagrams in vscode ? in svg ?

[vstirbu]

They are rendered as SVG.

[g3o2]

So there is certainly a way to expose the svg code, isn't there ?

Converting svg to png is indeed better left to specialised tools or packages. SVG Viewer is one such package in vscode. There are many other ways. However, being able to export the svg as such would be useful.

[vstirbu]

This plugin renders the mermaid diagram using a vscode component that is meant for previewing HTML that is not too heavy. There is no default channel back from the preview diagram to the plugin code, so getting the svg in the plugin, although doable, requires a bit of work.

[joeto0]

Any plans to implement this feature?

[doodoori2]

hmm... is there anyone can explain how to expose it with SVG code?
I can't find any menu for export. 😮

[lmathews19]

jebbs' PlantUML extension has a nifty implementation of export diagram - it supports export to png, svg, pdf.

Export Diagrams

• At cursor, in current file, in whole workspace, in workspace selected.
• Concurrent export.
• Generate URLs.
• Multi-Page Diagram support.
• From local or server.
• Image map (cmapx) support.

They also seem to have a dependency on JRE.