PlantUML diagrams.
Use the PlantUML proxy service as described in this stackoverflow discussion to display PlantUML diagrams in github markdown. Instead of passing diagram content within the URL,define a remote URL where the content can be fetched from, as e.g. in a repo.
This URL can be embedded in an HTML <img>
tag or a Markdown image syntax ![]()
. To leverage this feature when using GitHub, simply point the remote URL to a raw link of the PlantUML diagram in your repository.
- Adding a
?cache=no
might be a good idea because GitHubs caching will prevent your images from updating, if you change the sourcecode. - The
&fmt=svg
can be used to change the format
The following diagram shows what will happen when you open a Markdown page hosted on GitHub that contains such a link:
![example1](http://www.plantuml.com/plantuml/proxy?cache=no&fmt=svg&src=https://raw.githubusercontent.com/marcelofpfelix/plantuml-diagrams/master/example/example1.puml)
![example1_clear](http://www.plantuml.com/plantuml/proxy?cache=no&fmt=svg&src=https://raw.githubusercontent.com/marcelofpfelix/plantuml-diagrams/master/example/example1_clear.puml)
![example1_dark](http://www.plantuml.com/plantuml/proxy?cache=no&fmt=svg&src=https://raw.githubusercontent.com/marcelofpfelix/plantuml-diagrams/master/example/example1_dark.puml)
You can use a link to choose a skin:
@startuml
!includeurl https://raw.githubusercontent.com/marcelofpfelix/plantuml-diagrams/master/skins/skin_clear.puml
(...)
@enduml
- mermaid.js, not avalailable on github markdown
- draw.io