Feature Request : Diagrams on the web

[crazyglasses]

Convert the output from png to a web format (using viz.js) so that the rendered output can be shared via a link. The generation can also be done on the web page using a simple editor.

I am willing to work on the same .

[mingrammer]

I wonder how to implement the web versions using this Python library. Do we need a diagrams server to create the diagram behind the web editor?

Would you please share your ideas? :) Thanks.

[gabriel-tessier]

@crazyglasses Are you thinking of a mix between this: https://jgraph.github.io/drawio/src/main/webapp/index.html

and that: http://pythonfiddle.com/

Where we type the python code that will generate the graph and we can share it on the cloud or host it somewhere?

[gabriel-tessier]

I started one branch with flask still not full working... @mingrammer I wonder if it's good to push in this repository or create a completely different project, what do you think?

/other_topic When building I thought about 2 things that can be done and can be pushed in this project is:

• using docker to generate the diagrams, so instead of installing python and Graphviz. Just one alternative that can help people that prefer docker.
• another docker for contributer there's a couple of PR stuck because they have problem with autogen, installing go, black etc... running autogen on docker may help contribution. I'll work on this 2 too.

Sorry if I pollute the topic. I'll open another issue specific when I'll have something usable.

[FFengIll]

Is it possible to mix draw.io format with the output logic ?
Furthermore, can we use the rich icon library in draw.io ?

[renyuanz]

I just discovered this amazing project a few days ago and quickly attracted by its simplicity and intuitiveness.

But it took me some time to set up a python environment and this same idea came across to my mind, why not create a web service for this, that ppl can put python code in an online editor and get generated image easily.

So I created this web service last night, and it's online and easy to use: https://sappagram.herokuapp.com.

It is full "Diagrams features" compatible (running with the latest Diagrams package and python 3.8) and delivery with a PWA version. Just copy python code into the editor and click "submit", the image will be generated and displayed above.

[gabriel-tessier]

@renyuanz

Cool! There's already a work in progress project you can find it here: https://github.com/diagrams-web/diagrams-web if you want to join your force you are welcome!

[renyuanz]

@gabriel-tessier wow, that is awesome! I'd love to contribute but I barely can code in python. I'll open source mine and let's see if we can build something together 😄

[renyuanz]

Hi @mingrammer @gabriel-tessier

I just open-sourced my project as well: https://github.com/renyuanz/microdiagram, would you mind to add these 2 web-based projects as a reference in this main project's README? So that people can try the lib out quickly on a website without having to set up a python environment (this is quite difficult for non-python guys).

If you would allow, I can do a PR for adding this. Tell me anything about your thoughts.

[gabriel-tessier]

if you want to add a link on https://github.com/diagrams-web/diagrams-web you can push a PR anytime. 😀

[AndreMiras]

Pretty cool stuff overall and I also wanted to build a similar service using modern tech for the frontend part. However I can't think of a way to keep the backend safe from malicious command injection. Obviously it should be sand boxed, we could use cloud lambda functions or whatever, but still I'd like to prevent people to run anything malicious. Did you guys solve that problem? Things I got in mind to mitigate:

• sandbox
• opcodes white list
• network access whitelist
• execution resource limits (time, RAM, CPU and disk)

[gabriel-tessier]

@AndreMiras The project is still active (I use it... 🙋) https://github.com/diagrams-web/diagrams-web you can join there if you are interested. So far nobody use it except me so I don't add new features or changes that I don't need but it's still alive and I'm open to any collaboration. About the backend I run it in docker, as there's limited soft installed (no curl, no wget etc...) and we can limit the memory and CPU the attack surface is lower. Plus we can limit the python import in the code, I did not do it yet but it can be easily done by limiting only the import of diagrams class... basically the user should not be able to import os, sys or process related. One last thing as it's in docker if the image is altered the container my crash and get replaced so it can heal itself and not infect your server. Until now I more focus on building it for the 90% of people that will use it only to build diagrams than the 10% that will try to crash it. Another point is the more I think about and the more I think that it's not a good idea to make it available on the web (it should be only a demo site for try) If you build your infrastructure diagrams you must not trust a website, you should run it on your local or in your infra. And as it run on Docker it can be easily integrated in any intranet.

About sandbox I checked 2~3 years ago and found a blog about EdX that had this problem but did not solve it. There's maybe other resources but I dd not search more.