Draw.io embed editable diagram in GitHub wiki

45 views
Skip to first unread message

Luke Mcdonald

unread,
Jul 25, 2019, 4:42:13 AM7/25/19
to draw.io
I was looking at the documentation on GitHub at this link;



I read over the `readme` for clickable links for `Edit` | `Edit as New`. I saw its linked against a git pages url. Can I do this same embedding on GitHub without having pages? (Github Pages is not private and I do not want to host resources on Github pages for this reason)

Currently I can extract draw.io diagram svg and show it with GitHub wiki markdown below;
![Platform Diagram](../raw/master/resources/documents/diagram.svg)

I would like to have embedded editor within GitHub wiki.

Take the following snippet from your repo `readme`:

repohttps://github.com/jgraph/drawio-github

README.md;
<a href="http://jgraph.github.io/drawio-github/edit-diagram.html?repo=drawio-github&path=diagram.png" target="_blank">Edit</a> | <a href="https://www.draw.io/#Uhttps%3A%2F%2Fjgraph.github.io%2Fdrawio-github%2Fdiagram.png" target="_blank">Edit As New</a>

Instead of using
`http://jgraph.github.io/drawio-github/edit-diagram.html?repo=drawio-github&path=diagram.png`

I would could use
`https://github.com/jgraph/drawio-github/edit-diagram.html?repo=drawio-github&path=diagram.png`

Final Output would be something like this;

<a href="https://github.com/jgraph/drawio-github/edit-diagram.html?repo=drawio-github&path=diagram.png" target="_blank">Edit</a> | <a href="https://www.draw.io/https://github.com/jgraph/drawio-github/diagram.png" target="_blank">Edit As New</a>

I was hoping to see example how I could get this to work on GitHub wiki page.

Please NOTE:

1. My GitHub repo is private.
2. I do not want to use GitHub pages as its not private

I would like to use this feature just documents are not clear the approach. A step by step example of how to use this would be great, along with requirements. 

How to for displaying embedded draw.io diagrams in GitHub wiki would be great

Thank you so much for your time.

The SherpaCart

unread,
Jun 19, 2024, 9:40:49 AMJun 19
to draw.io Q&A
I too would like a straight forward explanation, I have Google Drive files that when i try to use the EMBED Iframe or EMBED svg, I place that code generated into the wiki page, but it is not interpreted as a diagram.

I have tried the various other methods described in the documenation and have draw.io app installed on the github.
It seems that to have a live diagram, there is a lot of programatic things that you have to do to make it happen which is more cumbersome than just dropping a new SVG into the wiki every time i change the diagram.
dave

draw.io Q&A

unread,
Jun 20, 2024, 3:04:41 AMJun 20
to draw.io Q&A
For the Edit link in private repos, you can use https://app.diagrams.net/#H{org}%2F{repo}%2F{ref}%2F{filename}
Reply all
Reply to author
Forward
0 new messages