There are also plugins for graphviz, which is a more structured language. I use it for documenting states in my code, e.g. <a href="https://marketplace.visualstudio.com/items?itemName=tintinweb.graphviz-interactive-preview" rel="nofollow">https://marketplace.visualstudio.com/items?itemName=tintinwe...</a> and <a href="https://marketplace.visualstudio.com/items?itemName=joaompinto.vscode-graphviz" rel="nofollow">https://marketplace.visualstudio.com/items?itemName=joaompin...</a>. Since graphviz is old, there are also command line tools to render the output.<p>For more information about graphviz: <a href="https://graphviz.org/" rel="nofollow">https://graphviz.org/</a>
I think this extension demonstrates the flexibility of VSCode and how easy it can be to extend the platform with an extension.<p>Although it's supported by Microsoft, it's heavily influenced by the Open-Source community. I believe that's the reason it's so popular and user-friendly for both developers and users.<p>Can you imagine someone trying to implement this extension on a proprietary platform like Visual Studio or IntelliJ? ... going through proprietary documentation with no access of the Source-Code to the underlying system... It would be a nightmare
The project has an embed mode, which was used in this case.<p>It needs a sequence embed, but basically you load draw in embed mode within an iFrame, do a handshake using postMessage, then load and save is direct between parent and frame, again using postMessage.<p>The idea is to be able to embed into hosts that are capable of storing the diagram data, without any code changes to draw. It can embed either the main site (which was renamed to app.diagrams.net), or a locally hosted/internally packaged version of the project.<p>Additional information on the embed format:<p><a href="https://github.com/jgraph/drawio-integration" rel="nofollow">https://github.com/jgraph/drawio-integration</a><p><a href="https://desk.draw.io/support/solutions/articles/16000042544-embed-mode" rel="nofollow">https://desk.draw.io/support/solutions/articles/16000042544-...</a>
This embeds an offline version of draw.io; I hadn't previously realised that this site is open source:
<a href="https://github.com/jgraph/drawio" rel="nofollow">https://github.com/jgraph/drawio</a><p>Very neat!
I've been looking at draw.io and PlantUML - what has worked well for others? draw.io is much easier to get into, but I can see declarative diagrams making maintenance easier for long-lived docs.
Similar (but not that fully featured) is the mermaid preview extension :
<a href="https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid" rel="nofollow">https://marketplace.visualstudio.com/items?itemName=bierner....</a><p>mermaid js website : <a href="https://mermaidjs.github.io/#/" rel="nofollow">https://mermaidjs.github.io/#/</a>
If we could get an extension like this for every file type VS Code could basically become your OS (desktop environment) or file manager at the very least.
That looks quite interesting. Can it detected embedded diagrams in PNG? I usually just save the PNG files, so I don't have to separately store the XML file.<p>Also just learned that Draw.io is migrating to Diagrams.net: <a href="https://www.diagrams.net/blog/move-diagrams-net" rel="nofollow">https://www.diagrams.net/blog/move-diagrams-net</a>
Now if we could get this for Monodraw I would pay money for that<p><a href="https://monodraw.helftone.com" rel="nofollow">https://monodraw.helftone.com</a>
Wow, nice! I've been using draw.io for a number of years now. It keeps getting better.<p>And this is frankly, amazing!<p>Question to author(s) - how can I support your development of draw.io?
Looks cool. However I've created a .drawio file after installing (and reloading) and I do not see any diagram editor. It's just a blank space. Is there anything else I need to do? I installed via VSCode extension marketplace.