#126: C4 relationships support description, sprite/openIconic and tags (4 - rename AddTagSupport() to AddElementTag(), AddRelTagSupport() to AddRelTag(), update img links)

C4-PlantUML combines the benefits of [PlantUML](http://en.plantuml.com/) and the [C4 model](https://c4model.com/) for providing a simple way of describing and communicate software architectures – especially during up-front design sessions – with an intuitive language using open source and platform independent tools.
C4-PlantUML combines the benefits of [PlantUML](https://plantuml.com/) and the [C4 model](https://c4model.com/) for providing a simple way of describing and communicate software architectures – especially during up-front design sessions – with an intuitive language using open source and platform independent tools.
C4-PlantUML includes macros, stereotypes, and other goodies (like VSCode Snippets) for creating C4 diagrams with PlantUML.
@ -32,6 +32,8 @@ If you want to use the always up-to-date version in this repo, use the following
Now let's create a C4 Container diagram:
\(If you don't want run PlantUML locally you can use e.g. the [PlantUML Web Server](http://www.plantuml.com/plantuml/uml/ZOxDIWGn48JlUOeufn5qSjcJfvNHsugBFsV99iqcsEc4T0VTjpSCE2AYUAeAgVwgjYosIakevytBBK824bPdaHms3pg85BuofjgtwHWbj4DZg2wJzDpaSZAliRh04ioykToZ9Nc-snbux_yUlEdGkOTj9AXJwJLAxQ5ofh4iSetHyeKUTlO0E7HpNoHcigXlW5sDosiuLojaT9_kn-aJk40Py_7q1-Znn09fv4N-swuU0ByFNbVyZlYQqmbR8DyIVW00) too.)
After you have included `C4_Container.puml` you can use the defined macro definitions for the C4 elements: `Person`, `Person_Ext`, `System`, `System_Ext`, `Container`, `Relationship`, `Boundary`, and `System_Boundary`
* (lowercase) `setIndex($new_index)`: set the new index (procedure which has no direct output)
* `LastIndex()`: return the last used index (function which can be used as argument)
following 2 macros requires V1.2020.24Beta4 (can be already tested with http://www.plantuml.com/plantuml/)
following 2 macros requires V1.2020.24Beta4 (can be already tested with https://www.plantuml.com/plantuml/)
* `Index($offset=1)`: returns current index and calculates next index (function which can be used as argument)
* `SetIndex($new_index)`: returns new set index and calculates next index (function which can be used as argument)
@ -198,8 +200,8 @@ You can force the direction of a relationship by using:
* `Rel_L`, `Rel_Left`
* `Rel_R`, `Rel_Right`
Relation specific sprites are not down scaled, they requires typically smaller icons.
Or alternatively if sprite argument starts with `&` an OpenIconic name can be used (details see https://useiconic.com/open)
Relationship specific sprites are not down scaled, they requires typically smaller icons.
Therefore if sprite argument starts with `&` an OpenIconic name can be used too (details see https://useiconic.com/open)
```csharp
@startuml
@ -234,7 +236,7 @@ Rel(user, system, "orders", "http", "only small sprites looks ok, like the small
@enduml
```


In rare cases, you can force the layout of objects which have no relationships by using:
@ -274,7 +276,7 @@ Rel_L(x, s4, "uses")
@enduml
```


## Layout Options
@ -294,10 +296,10 @@ C4-PlantUML also comes with some default person sprite options:
Additional tags/stereotypes can be added to the existing element stereotypes (component, ...) and highlight,... specific aspects:
@ -460,7 +462,7 @@ It is possible to save them directly inside VS Code: [Creating your own snippets
## Advanced Samples
The following advanced samples are reproductions with C4-PlantUML from official [C4 model samples](https://c4model.com/#examples) created by [Simon Brown](http://simonbrown.je/).
The following advanced samples are reproductions with C4-PlantUML from official [C4 model samples](https://c4model.com/#examples) created by [Simon Brown](https://simonbrown.je/).
The core diagram samples from [c4model.com](https://c4model.com/#coreDiagrams) are available [here](samples/C4CoreDiagrams.md).
@ -468,25 +470,25 @@ The core diagram samples from [c4model.com](https://c4model.com/#coreDiagrams) a
[PlantUML](http://en.plantuml.com/) is an open source project that allows you to create UML diagrams.
[PlantUML](https://plantuml.com/) is an open source project that allows you to create UML diagrams.
Diagrams are defined using a simple and intuitive language.
Images can be generated in PNG, in SVG or in LaTeX format.
PlantUML was created to allow the drawing of UML diagrams, using a simple and human readable text description.
Because it does not prevent you from drawing inconsistent diagrams, it is a drawing tool and not a modeling tool.
It is the most used text-based diagram drawing tool with [extensive support into wikis and forums, text editors and IDEs, use by different programming languages and documentation generators](http://en.plantuml.com/running).
It is the most used text-based diagram drawing tool with [extensive support into wikis and forums, text editors and IDEs, use by different programming languages and documentation generators](https://en.plantuml.com/running).
The [C4 model](https://c4model.com/) for software architecture is an "abstraction-first" approach to diagramming, based upon abstractions that reflect how software architects and developers think about and build software.
The small set of abstractions and diagram types makes the C4 model easy to learn and use.
@ -498,8 +500,8 @@ More information can be found here:
* [The C4 model for software architecture](https://c4model.com/)
* [REAL WORLD PlantUML - Sample Gallery](https://real-world-plantuml.com/)
* [Visualising and documenting software architecture cheat sheets](http://www.codingthearchitecture.com/2017/04/27/visualising_and_documenting_software_architecture_cheat_sheets.html)
* [PlantUML and Structurizr - Create models not diagrams](http://www.codingthearchitecture.com/2016/12/08/plantuml_and_structurizr.html)
* [Visualising and documenting software architecture cheat sheets](https://www.codingthearchitecture.com/2017/04/27/visualising_and_documenting_software_architecture_cheat_sheets.html)
* [PlantUML and Structurizr - Create models not diagrams](https://www.codingthearchitecture.com/2016/12/08/plantuml_and_structurizr.html)
The following samples are reproductions with C4-PlantUML from [C4 model core diagrams](http://c4model.com/#coreDiagrams) created by [Simon Brown](http://simonbrown.je/).
The following samples are reproductions with C4-PlantUML from [C4 model core diagrams](https://c4model.com/#coreDiagrams) created by [Simon Brown](https://simonbrown.je/).




Rel_U(web, spa, "Delivers to the customer's web browser")
Rel(api, db, "Reads from and writes to", "JDBC")
Rel(api, db2, "Reads from and writes to", "JDBC", $descr="only in case of a problem", $sprite="person", $tags="fallback")
Rel(api, db2, "Reads from and writes to", "JDBC", $tags="fallback")
Rel_R(db, db2, "Replicates data to", "message" , $descr="only in case of a problem only in case of a problem", $sprite="&envelope-closed", $tags="fallback")