plantuml-stdlib / c4-plantuml Goto Github PK

I have diagram like this:

I want to add arrows between components in section A. I want to end up with something like this:

Currently I get this:

This approach downgrade readability. Can I align somehow all components in section A?

Source codes
without internal connection:

@startuml
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Container.puml

LAYOUT_LEFT_RIGHT

Person(person, "Person")

Enterprise_Boundary(a, "A") {
    System(system_a_1, "System A1")
    System(system_a_2, "System A2")
    System(system_a_3, "System A3")
}
Enterprise_Boundary(b, "B") {
    System(system_b_1, "System B1")
    System(system_b_2, "System B2")
}

Rel(person, system_a_3, " ")

Rel(person, system_a_2, " ")

Rel(system_a_2, system_b_2, " ")
Rel(system_a_1, system_b_1, " ")
Rel(system_b_1, system_a_1, " ")

Rel(system_a_3, system_b_1, " ")
@enduml

with internal connection:

@startuml C1 System context diagram
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Container.puml

LAYOUT_LEFT_RIGHT

Person(person, "Person")

Enterprise_Boundary(a, "A") {
    System(system_a_1, "System A1")
    System(system_a_2, "System A2")
    System(system_a_3, "System A3")
}
Enterprise_Boundary(b, "B") {
    System(system_b_1, "System B1")
    System(system_b_2, "System B2")
}

Rel(person, system_a_3, " ")

Rel(person, system_a_2, " ")

Rel(system_a_2, system_b_2, " ")
Rel(system_a_1, system_b_1, " ")
Rel(system_b_1, system_a_1, " ")

Rel(system_a_3, system_b_1, " ")

Rel(system_a_1, system_a_2, " ")
Rel(system_a_2, system_a_1, " ")
@enduml

Hello, is it possible to generate Tier Application Architecture?, for example in FrontEnd, MiddleWare and BackEnd.

as in the following yellow image

I am using Rel_L to orient the flow of my diagram. The other directions work but Rel_L keep pointing the flow to the right when I need it to go left.

The Behavior I am noticing. The last relationship at the bottom of the diagram is the only one that will work with Rel_L. Everything else will automatically go to the right even if I am specifying Rel_L.

My diagrams contains multiple boundaries and nested boundaries. I am defining the relationships between system objects. I am trying to go left with in the boundaries to make my diagram more readable.

Please me know if there is more information is needed to pin point the issue.

Hi Ricardo,

Can autonumber be supported? A bit like in Sequences.

Thanks.

Hi Richardo,

I was trying to use C4-PlantUML to render a C4 diagram, but the application is stuck there, and the log like below:

java -jar plantuml.jar /Users/x/Documents/MyTechDocs/C4PumlTest.puml -v 
(0.000 - 245 Mo) 237 Mo - PlantUML Version 1.2019.03 
(0.013 - 245 Mo) 237 Mo - GraphicsEnvironment.isHeadless() false 
(0.013 - 245 Mo) 237 Mo - Forcing resource load on OpenJdk 
(1.254 - 245 Mo) 236 Mo - Found 1 files 
(1.254 - 245 Mo) 236 Mo - Working on /Users/x/Documents/MyTechDocs/C4PumlTest.puml 
(1.265 - 245 Mo) 236 Mo - Setting current dir: . 
(1.265 - 245 Mo) 236 Mo - Setting current dir: /Users/x/Documents/MyTechDocs 
(1.268 - 245 Mo) 236 Mo - Using default charset 
(1.271 - 245 Mo) 236 Mo - Reading from C4PumlTest.puml 
(1.271 - 245 Mo) 236 Mo - Creating AParentFolderRegular /Users/x/Documents/MyTechDocs 
(1.283 - 245 Mo) 234 Mo - ImportedFiles::getAFile nameOrPath = /Users/x/Documents/Arch/C4PlantUML/C4_Container.puml 
(1.284 - 245 Mo) 234 Mo - ImportedFiles::getAFile currentDir = AParentFolderRegular::/Users/x/Documents/MyTechDocs 
(1.285 - 245 Mo) 234 Mo - Using default charset 
(1.285 - 245 Mo) 234 Mo - Reading from /Users/x/Documents/Arch/C4PlantUML/C4_Container.puml 
(1.292 - 245 Mo) 234 Mo - Using default charset 
(1.292 - 245 Mo) 234 Mo - Reading from /Users/x/Documents/Arch/C4PlantUML/C4_Container.puml 
(1.292 - 245 Mo) 234 Mo - Getting parent of AFileRegular::/Users/x/Documents/Arch/C4PlantUML/C4_Container.puml 
(1.292 - 245 Mo) 234 Mo - Creating AParentFolderRegular /Users/x/Documents/Arch/C4PlantUML 
(1.292 - 245 Mo) 234 Mo - -->The parent is AParentFolderRegular::/Users/x/Documents/Arch/C4PlantUML 
(1.293 - 245 Mo) 234 Mo - Creating AParentFolderRegular /Users/x/Documents/Arch/C4PlantUML 
(1.294 - 245 Mo) 234 Mo - Using default charset

And my .puml file content like below:

@startuml Basic Sample
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Container.puml

Person(admin, "Administrator")
System_Boundary(c1, "Sample System") {
    Container(web_app, "Web Application", "C#, ASP.NET Core 2.1 MVC", "Allows users to compare multiple Twitter timelines")
}
System(twitter, "Twitter")

Rel(admin, web_app, "Uses", "HTTPS")
Rel(web_app, twitter, "Gets tweets from", "HTTPS")
@enduml

Could you please tell what's going wrong here?

Hello, good afternoon.

Is there an option to add text or labels in the corners of the System_Boundary at the same time?

as the following example:

System_Boundary(c1, "DeskTop PC", "Wintel","Windows 10","Browser\nChrome or IE"){

}
and get something like the following picture

Thanks a lot
Domingo Tapia

It seems that the preprocessor has deprecated zero-argument macros without parenthesis in a recent version of PlantUML. So all of the samples that use LAYOUT_WITH_LEGEND or LAYOUT_LEFT_RIGHT fail to compile with a syntax error

@startuml Gives a lovely picture
!includeurl <C4/C4_Context.puml>

LAYOUT_WITH_LEGEND()

Person(admin, "Administrator")
@enduml

looks like this

@startuml Gives a syntax error
!includeurl <C4/C4_Context.puml>

LAYOUT_WITH_LEGEND

Person(admin, "Administrator")
@enduml

gives syntax error

I don't really fancy being the person to fix up all of the samples myself, but someone has to... I think this may also be the explanation for the issue described in #78

I am using PlantUML extension in Visual Studio Code.

Seems to work fine until i try the Layout with legend or layout as sketch.

This specific test is with the C4_Context.puml file. I get the error with all files though.

I get a syntax error in the preview window:

...
.. (skipping 85 lines)
...

skinparam database<<external_system>> {
StereotypeFontColor #FFFFFF
FontColor #FFFFFF
BackgroundColor #999999
BorderColor #8A8A8A
}

Turns out that text is just prior to the macro definition for the LAYOUT_WITH_LEGEND. So something is not right with the macro, or the plantUML extension maybe has a bug with multi line macros?

Hi community,

first of all, big thanks to all of you constantly pushing me.
For private and professional reasons I could not find enough love for this project in the last two years.
I apologize for this!

I propose the following changes / next steps:

• adding two additional contributors to the project
• choosing (and aligning with the owner - should in my view one of the contribs above) one fork and merging everything back
• add the usage of GitHub Actions for creating the samples and verifying the lib
• updating C4-PlantUML in the PlantUML Standard Library
• after that also applying the same to https://github.com/RicardoNiepel/Azure-PlantUML/

Anything I forgot?
And most important:

• Which is the most used / future ready fork and would love to be also a contributor?
• Who wants to be one of the additional contributors?
  (I would really love to have somone here who is using it every week and thus has an ongoing interest of it)

@adrianvlupu, @fineconstant, @IOrlandoni, @stawirej, @xmobe, @Potherca, @aheil

I just tested this extension and it works fine. I have a nice preview in VS code. The readme does not mention how to export this preview to an actual file. Could this be added?

Hello, there is some way to call a JavaScript function instead of a URL, for example:

I want to call the profiledetail function of javascrip:

actor "This is [[javascript:profiledetail('/Architecture/PlantArchitectureDiagram?handler=DetailSystem','tibco_icc') Operator]] profile" as Operator

Instead of

actor "This is [[http://plantuml.com/sequence Operator]] profile" as Operator

thank you so much for your support.
DTapia

I often find it hard to get the layout I want and I see in your examples that you use "layout commands", such as Lay_D and Lay_U. Could you please add a few lines in the documentation on how to use these and how to think about how to order the elements (ie should I use Rel_R or Lay_R, for example).

This projects is just what I need now, after getting stuck using Structurizr.Net to generate PlantUML.

There just one thing, the look of Person (Actor in PlantUML) which leave something to be desired. Would it be possible to either use the Actor element from PlantUML or modify the shape to look more like the shape used by Simon Brown in C4?

Do you have any plans to continue to enhance the look of the generated diagrams?

Hi,

Firstly, thanks for this repo, it's helped me get up and running quite quickly.

I have everything functioning for previews in VSC except I am seeing a red exclamation mark appear above my renders complaining about a font and what looks to be a security violation.

Error found in diagram Fabric Statements Rendering in CCM
2020-03-17 12:43:45.429 java[81535:1647976] CoreText note: Client requested name ".SFNS-Regular", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
2020-03-17 12:43:45.429 java[81535:1647976] CoreText note: Set a breakpoint on CTFontLogSystemFontNameRequest to debug.
2020-03-17 12:43:45.430 java[81535:1647976] CoreText note: Client requested name ".SFNS-Bold", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
2020-03-17 12:43:45.430 java[81535:1647976] CoreText note: Client requested name ".SFNSMono-Regular", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
2020-03-17 12:43:45.434 java[81535:1647976] CoreText note: Client requested name ".SFNSMono-Regular", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
2020-03-17 12:43:45.434 java[81535:1647976] CoreText note: Client requested name ".SFNSMono-Regular", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
2020-03-17 12:43:45.434 java[81535:1647976] CoreText note: Client requested name ".SFNS-Regular", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
2020-03-17 12:43:45.434 java[81535:1647976] CoreText note: Client requested name ".SFNS-Bold", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].
WARNING: An illegal reflective access operation has occurred
WARNING: Illegal reflective access by net.sourceforge.plantuml.svg.SvgGraphics (file:/Users/faizn/.vscode/extensions/jebbs.plantuml-2.13.6/plantuml.jar) to constructor com.sun.org.apache.xalan.internal.xsltc.trax.TransformerFactoryImpl()
WARNING: Please consider reporting this to the maintainers of net.sourceforge.plantuml.svg.SvgGraphics
WARNING: Use --illegal-access=warn to enable warnings of further illegal reflective access operations
WARNING: All illegal access operations will be denied in a future release

I can work around this but I'm mentioning it in case it became a problem in future versions of the background software.

I've googled 'CoreText note: Client requested name ".SFNS-Regular", it will get Times-Roman rather than the intended font. All system UI font access should be through proper APIs such as CTFontCreateUIFontForLanguage() or +[NSFont systemFontOfSize:].' and quite a few projects are running into it.

https://www.google.com/search?q=CoreText+note%3A+Client+requested+name+%22.SFNS-Regular%22%2C+it+will+get+Times-Roman+rather+than+the+intended+font.+All+system+UI+font+access+should+be+through+proper+APIs+such+as+CTFontCreateUIFontForLanguage()+or+%2B%5BNSFont+systemFontOfSize%3A%5D.&oq=CoreText+note%3A+Client+requested+name+%22.SFNS-Regular%22%2C+it+will+get+Times-Roman+rather+than+the+intended+font.+All+system+UI+font+access+should+be+through+proper+APIs+such+as+CTFontCreateUIFontForLanguage()+or+%2B%5BNSFont+systemFontOfSize%3A%5D.&aqs=chrome..69i57.187j0j7&sourceid=chrome&ie=UTF-8

Hi,

I am trying to manipulate the <> stereotype font color or size, but it seems to have no effect. All other types working correctly.

No matter what I do, the stereotype remains here white and the size remains default:

what I currently have for styling:

!define BORDER_COLOR      #333333
!define FONT_COLOR        #333333

skinparam rectangle<<boundary>> {
  Shadowing false
  StereotypeFontSize 0
  StereotypeFontColor FONT_COLOR
  FontColor FONT_COLOR
  BorderColor BORDER_COLOR
  BorderStyle dashed

Thanks for your help.

Hi!

Currently, 2 types of relationships are supported (skinparam linetype):

• Standard (when elements are loosely connected and arrows (skinparam linetype disabled))
  -ortho (when the bend angles of the arrows are at right angles (skinparam linetype ortho))

Is it possible to establish a “direct” connection style when each element is connected and the arrows do not bend?

Current version of PlantUML extension for VSCode defines the language as "plantuml" rather than "diagram" making the C4.code-snippets not work.

qjebbs/vscode-plantuml#306

Please advice.

I using UML below which i put in my Confluence page. However, the UML didn't appear, besides give message "syntac error?" , From String Line 45 as image attached. Please help

https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Container.puml

I would like to add custom stereotypes to Container(...) but the current syntax don't allow that.

My precise use case is two-fold : I have deployment diagrams built with Structurizr-plantuml and I would like to highlight

1. Containers defined in architecture diagram but not deployed (<missing> containers)
2. Container version (and the match of this version with the one defined in architecture)

How can I do that if I can't put a stereotype and have a custom rendering done with skinParam ?

Hello.

How I can change the shape of technology artifacts?

For example, the artifacts shown in the following image

I use them to represent the state of each system or component in my architecture.

any help to achieve this is greatly appreciated.

cordial greetings...

Hi,

I would like to use your C4 model for plantuml but it doesn't work for the types System and Enterprise_Boundary. The error is an syntax error in plantuml. I also tried your samples, but the same behavior. If i try to use include instead of includeurl, i get an error, that the referenced file is not there.

What do you need to reproduce the issue?

Regards Constantin

I have recently started using C4-PlantUML, but I have been disapointed with a few things that tend to keep on happending. When there are multiple external systems in place the diagram tends to get "wider" causing a very funky layout.

Here the code for this diagram is:

@startuml C4_Elements
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Container.puml

skinparam linetype ortho

Person(OrbitShareUser, "Orbit-Share User", "A User of the Orbit-Share web solution, with a personal UNI-Login Account")

System_Boundary(WebSolution, "Orbit-Share Web Solution"){
Container(SPA, "Single-Page-Application", "Container: Angular", "Client containing all of the websites UI functionality for teachers using their preferenced web browser")
Container(DeployedPage, "Deployed Web Server", "Container:Node.js, Express.js & Heroku CLI", "Deployed webserver")
Container(API, "REST API", "Container:Node.js & Express.js", "Allows users to access and share teaching resources")
ContainerDb(collectionDB, "Orbit-Share-Database", "Containts User, Content and Collection data into their respective collections")
}
System_Ext(UserDevice, "User's Device", "Stores the exported teaching resource(s) to the users device")
System_Ext(UniLogin, "UNI-Login Management System", "Optional Description")
System_Ext(OrbitBox, "ORBIT-Box", "A System that contains the sensors and actuators necessary to conduct a lessons experiments, can contain and view the teaching resource")


Rel(OrbitShareUser, DeployedPage, "Visits orbitshare.com", "HTTPS")
Rel(DeployedPage, SPA, "Delivers to user's browser")

Rel(SPA, API, "Makes API calls to", "HTTP")

Rel(API, collectionDB, "Reads from and writes to")
Rel(API, UserDevice, "Downloads teaching resource to")
Rel(API, UniLogin, "Authenticates user login using","SAML")
Rel(API, OrbitBox, "Exports Orbit-Box Files to")

@enduml

Is there any way to fix this issue with the commands that are already in place or is this a bug? I have tried using the layout options, but it was to no avail. Hope someone can help me out!

When testing on a single diagram, I get errors when attempting to export to either HTML or PDF format.

When exporting to HTML, I get the following stack trace in the VS Code Output window:

Error found in diagram Basic Sample
java.lang.UnsupportedOperationException: HTML
	at net.sourceforge.plantuml.ugraphic.ImageBuilder.createUGraphic(ImageBuilder.java:400)
	at net.sourceforge.plantuml.ugraphic.ImageBuilder.writeImageInternal(ImageBuilder.java:238)
	at net.sourceforge.plantuml.ugraphic.ImageBuilder.writeImageTOBEMOVED(ImageBuilder.java:179)
	at net.sourceforge.plantuml.svek.CucaDiagramFileMakerSvek.createFileInternal(CucaDiagramFileMakerSvek.java:127)
	at net.sourceforge.plantuml.svek.CucaDiagramFileMakerSvek.createFile(CucaDiagramFileMakerSvek.java:71)
	at net.sourceforge.plantuml.cucadiagram.CucaDiagram.exportDiagramInternal(CucaDiagram.java:425)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramNow(UmlDiagram.java:202)
	at net.sourceforge.plantuml.AbstractPSystem.exportDiagram(AbstractPSystem.java:135)
	at net.sourceforge.plantuml.SourceStringReader.outputImage(SourceStringReader.java:154)
	at net.sourceforge.plantuml.Pipe.managePipe(Pipe.java:111)
	at net.sourceforge.plantuml.Run.managePipe(Run.java:359)
	at net.sourceforge.plantuml.Run.main(Run.java:166)
Exception in thread "main" java.lang.UnsupportedOperationException: HTML
	at net.sourceforge.plantuml.ugraphic.ImageBuilder.createUGraphic(ImageBuilder.java:400)
	at net.sourceforge.plantuml.ugraphic.ImageBuilder.writeImageInternal(ImageBuilder.java:238)
	at net.sourceforge.plantuml.ugraphic.ImageBuilder.writeImageTOBEMOVED(ImageBuilder.java:179)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramError(UmlDiagram.java:255)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramError(UmlDiagram.java:217)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramNow(UmlDiagram.java:210)
	at net.sourceforge.plantuml.AbstractPSystem.exportDiagram(AbstractPSystem.java:135)
	at net.sourceforge.plantuml.SourceStringReader.outputImage(SourceStringReader.java:154)
	at net.sourceforge.plantuml.Pipe.managePipe(Pipe.java:111)
	at net.sourceforge.plantuml.Run.managePipe(Run.java:359)
	at net.sourceforge.plantuml.Run.main(Run.java:166)

When exporting to PDF, I get this stack trace:

Error found in diagram Basic Sample
java.lang.ClassNotFoundException: org.apache.batik.apps.rasterizer.SVGConverter
	at java.net.URLClassLoader.findClass(Unknown Source)
	at java.lang.ClassLoader.loadClass(Unknown Source)
	at sun.misc.Launcher$AppClassLoader.loadClass(Unknown Source)
	at java.lang.ClassLoader.loadClass(Unknown Source)
	at java.lang.Class.forName0(Native Method)
	at java.lang.Class.forName(Unknown Source)
	at net.sourceforge.plantuml.pdf.PdfConverter.convert(PdfConverter.java:57)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramInternalPdf(UmlDiagram.java:337)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramNow(UmlDiagram.java:198)
	at net.sourceforge.plantuml.AbstractPSystem.exportDiagram(AbstractPSystem.java:135)
	at net.sourceforge.plantuml.SourceStringReader.outputImage(SourceStringReader.java:154)
	at net.sourceforge.plantuml.Pipe.managePipe(Pipe.java:111)
	at net.sourceforge.plantuml.Run.managePipe(Run.java:359)
	at net.sourceforge.plantuml.Run.main(Run.java:166)
Exception in thread "main" java.lang.UnsupportedOperationException
	at net.sourceforge.plantuml.pdf.PdfConverter.convert(PdfConverter.java:76)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramInternalPdf(UmlDiagram.java:337)
	at net.sourceforge.plantuml.UmlDiagram.exportDiagramNow(UmlDiagram.java:198)
	at net.sourceforge.plantuml.AbstractPSystem.exportDiagram(AbstractPSystem.java:135)
	at net.sourceforge.plantuml.SourceStringReader.outputImage(SourceStringReader.java:154)
	at net.sourceforge.plantuml.Pipe.managePipe(Pipe.java:111)
	at net.sourceforge.plantuml.Run.managePipe(Run.java:359)
	at net.sourceforge.plantuml.Run.main(Run.java:166)

Exporting to an image (like PNG) seems to work as expected.

I use PlantUML extension for VSCode. Most of the examples from readme not working because of LAYOUT_WITH_LEGEND. After removing it I have additional captions in blocks:

How to remove these «component/container» captions?

Thanks for the great work. I would like to use hexagon for microservice container instead of rectangle. Where should I add this additional container type?

If I don't want a legend I get automatically the stereotypes in the diagrams.
Wouldn't it be better if the stereotypes could be activated/deactivated in a separate call (too)?
like e.g. STEREOTYPE_HIDE() and STEREOTYPE_SHOW()?

@startuml
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4_Component.puml
Container(alias, "label", "technology")
@enduml

@startuml
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4_Component.puml
LAYOUT_WITH_LEGEND()
Container(alias, "label", "technology")
@enduml

Hi,

Is it possible to change the color of a relationship ?

I stumbled on this because of a link from https://kroki.io/

You are doing stuff with PlantUML that I had no idea was possible despite me spending a lot of time looking at the docs. I have been using PlantUML in my tech documents for a year or so and I love it but you are bringing some stuff in the includes to a whole other level.

Thank you!!!!

I've opened an issue at the PlantUML-Server project:
plantuml/plantuml-server#143

The summary is that the server can't find the puml files I copied from your repo to the root of the server repo and restarted the server, but I get the file not found error for "!include C4_Context.puml" for example.

I need to know where to place those files so that I can use the local !include directives instead of the remote !includeurl paths.

Thanks,
Ajit

Hi, is it possible to have "bidirectional" arrows between two type of entities (X <-----> Y) to abbreviate things? For example I'd like to represent that there is a response to the transaction request.

thanks in advance.
Domingo Tapia

Hi! I'm in the process of opening MRs in plantuml-stdlib. It looks like changes have been made since the *.puml files were last updated in plantuml-stdlib, but since there is no versioning available in this repo, it's not something I can easily automate.

Would it be possible to add git tags to this project?

Contrary to component and container diagrams the context diagrams don't support a fourth parameter for systems and persons: https://github.com/RicardoNiepel/C4-PlantUML/blob/master/C4_Context.puml

As per http://static.codingthearchitecture.com/visualising-software-architecture.pdf systems and persons can have stereotypes (those [] beneath the label).

In a bid to help manage the proliferation of system names used in our C4 plantuml scripts, I was experimenting with using choice lists in the VS Code snippet..

It works well.. but keen to explore whether it is possible for the choice values can be externalised.

"C4_System_ANZx": {
"scope": "diagram",
"prefix": "System for ANZx",
"body": [
"System(${1|cap,ctm,ocv,fabric,zafin|}, {\$get_label($1)))",
"$0"
],
"description": "Add System to C4 diagram"
},

Readme still uses old RicardoNiepe urls.
URL should be changed to official plantuml-stdlib ones

@adrianvlupu thank you that you merged my dynamic and deployment extension into stdlib.

In the "C4_Deployment Diagram Sample - bigbankplc.puml" I would (re)add

• the directed relations

Rel(mobile, api, "Makes API calls to", "json/HTTPS")
Rel(spa, api, "Makes API calls to", "json/HTTPS")
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")
Rel_R(db, db2, "Replicates data to")

• add the linebreak in the node tech (I fixed itsize:$TECHN_FONT_SIZE)

Deployment_Node(comp, "Customer's computer", "Mircosoft Windows of Apple macOS"){
    Deployment_Node(browser, "Web Browser", "Google Chrome, Mozilla </size>\n<size:$TECHN_FONT_SIZE>Firefox, Apple Safari or </size>\n<size:$TECHN_FONT_SIZE>Microsoft Edge"){
        Container(spa, "Single Page Application", "JavaScript and Angular", "Provides all of the Internet Banking functionality to customers via their web browser.")
    }
}

And in the "README" I would

• add "$index" as dynamic macro

Should I do it?

Best regards
Helmut

Make links in README.md HTTPS so that organizations where HTTPS is enforced can still view the link content locally.

Hi,

I really love using this library to create C4 models of my applications. But I can't help noticing that the development has stopped. Even simple pull requests with typos aren't merged.

If this library isn't in development anymore, I will need to search for an alternative for future projects.

When using Rel to connect two higher level entities (e.g. System) both having children (e.g. Container), the rendered image will display the following: "===label", instead of the formatted label.

Example:

@startuml
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/master/C4_Component.puml

System(A, "systemA") {
    Container(B,"containerB","B")
}
System(C, "systemC") {
    Container(D,"containerD","D")
}
'This is wrong:
Rel(A,C,"AC")

'These are all OK:
'Rel(A,B,"AB")
'Rel(A,D,"AD")
'Rel(B,C,"BC")
'Rel(B,D,"BD")
'Rel(C,D,"CD")
@enduml

As MRs are being opened and work commenses, I thought it might be good idea to address the topic of whom is "allowed" to merge. (As this is actionable, I created an Issue, rather than a Discussion)

I've seen this become a bottleneck in other projects caused by bystander apathy.

As we want to help @RicardoNiepel by taking over some of the load, my proposed guidelines are:

1. Add the most active developers for a review (Currently @adrianvlupu, @aheil, @IOrlandoni, and @RicardoNiepel)
2. When an MR has X approvals from those developers it can be merged.
3. The author of the MR should merge their own MR (in case of conflicts they will be best suited to resolve things), unless someone else is waiting for the work from that MR.
4. Don't worry about things too much. A merge to master is not the same as a release.
   There is always time to correct (or undo) anything that goes in the wrong direction.
   Better to keep moving forward than to have to wait for everyones approval.

I know all of this is implicitly more or less the way of doing things but I think it would be good to make it Explicit.

So what do you say? Agree/Disagree? Suggestions for improvement?

Tasks

• Agree on how many "X approvals" should be

• Get everyone's feedback and approval:

  • @adrianvlupu
  • @aheil
  • @Crashedmind
  • @IOrlandoni
  • @RicardoNiepel
  • @stawirej

Do you have plant to support intellij idea as a plugin ?

The LAYOUT_WITH_LEGEND macro now gives a syntax error when you upgrade from PlantUML 1.2019.5 to 1.2019.6

Should I change how I use it or should the definition of the macro be changed?

At the top of your C4 PlantUML .puml file

What need to be done, to understand Getting Started section? I have no idea, what is your C4 PlantUML .puml file)

I could create it and fill it with example code, but the next question is: how to transpile .puml file to .svg file?

For a couple of my containers A and B, adding two relationships between them (one for each direction) caused the label text to overlap. This didn't happen when the same thing was done on some other containers within my diagram. I assume this is a graphviz thing... Is there a suggested remedy for this kind of thing?

Users don't look like users and databases don't look like databases.

all "percy" diagramms has a include section like

!include ./../C4_Container.puml
!include ./../C4_Context.puml
!include ./../C4.puml

This looks wrong for me.

1. C4_Container.puml includes C4_Context.puml already, why is it repeated?
2. If this pattern is used with "first" C4_Dynamic.puml and "last" C4.puml, then the automatic indexing is overwritten.

I think "percy" should include only the "first" *.puml and skip all following includes

BR Helmut

Hello,

An option to make relationship arrows dotted would be very useful to express different types of relationships and distinguish them visually 😃

I made a pull request with changes here #66
For now I named new elements using _Async suffix e.g. Rel_Async(...), but maybe it is better not to suggest that these new relationships are asynchronous and normal ones are synchronous... in the end it can mean something different based the context.
Other names like _Weak, _Dotted or something entirely else are possible - feel free to comment on this or suggest something 😄

As an infrastructure architect
I want to be apple to skin plantuml diagrams as C4 deployment diagrams
So that I'll get all my diagrams with the same look and feel

I have been trying to use Rel_U, Rel_L, Rel_D, Rel_R to get a better layout, but it is simply too difficult to use this on a larger project with little to no reference on what the different relations do. This is the code right now:

@startuml C4_Elements
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Component.puml

' skinparam linetype ortho
skinparam minClassWidth 200

LAYOUT_TOP_DOWN


Container(SPA, "Single-Page-Application","Container: TypeScript and Angular", "A User of the Orbit-Share web solution, with a personal UNI-Login Account")


System_Boundary(AngularApp, "Angular Application"){
Component(FieldErrors, "FieldErrors Component", "Component: Angular Component", "Contains functionality to view")
Component(Home, "Home Component", "Component: Angular Component", "Contains a list of all uploaded content and collections, reused to show search results")
Component(Profile, "Profile Component", "Component: Angular Component", "A users profile containing a list of all content and collections they have uploaded and profile management")
Component(Support, "Support Component", "Component: Angular Component", "Support Page component containing a template and no other functionality")
Component(Toolbar, "Toolbar Component", "Component: Angular Component", "Toolbar containing features for navigation, search and logout")
Component(Welcome, "Welcome Component", "Component: Angular Component", "Component containing welcome page template")
Component(AuthenticationModule, "Auth Module", "Component: Angular Module", "Module which contains all components referring to authentication and authorization")
Component(Login, "Login Component", "Component: Angular Component", "Login functionality and layout")
Component(Register, "Register Component", "Component: Angular Component", "Registration functionality and layout")
Component(ContentModule, "Content Module", "Component: Angular Module", "Module which contains all components referring to content")
Component(CreateContent, "Create Content Component", "Component: Angular Component", "Component for uploading a single item")
Component(ViewContent, "View Content Component", "Component: Angular Component", "Component for viewing content uploaded to the platform")
Component(CollectionModule, "Collection Module", "Component: Angular Module", "Module which contains all components referring to Collections")
Component(CreateCollection, "Create Collection Component", "Component: Angular Component", "Component for uploading multiple items at once")
Component(SocialModule, "Social Module", "Component: Angular Component", "Module which contains all components referring to Social aspects")
Component(Comments, "Comments Component", "Component: Angular Component", "Gives the user the ability to comment on content")
Component(AuthenticationService, "Authentication Service", "Component: Angular Service", "Authenticates and Authorizes Users")
Component(CommentsService, "Comments Service", "Component: Angular Service", "Authenticates and Authorizes Users")
Component(ErrorService, "Error Service", "Component: Angular Service", "Creates Error messages for other services")
Component(ViewContentService, "Content Viewing Service", "Component: Angular Service", "Accesses endpoints to fetch content data")
Component(CreateContentService, "Content Creation Service", "Component: Angular Service", "Accesses endpoints to POST uploaded form data to server")
Component(CreateCollectionService, "Collection Creation Service", "Component: Angular Service", "Accesses endpoints to POST uploaded Collections to server")
Component(HomeService, "Home Service", "Component: Angular Service", "GET's all collection and content text data")
Component(ProfileService, "Profile Service", "Component: Angular Service", "GET's the currently logged in user's username, content and collection")
}

Container(Server, "REST API", "Container:Node.js & Express.js", "Expres.js webserver containing a RESTful API")

Rel(SPA, FieldErrors, "Shows validation errors using")
Rel(SPA, Home, "Upon authentication shows")
Rel(SPA, Toolbar, "Shows on all authorized pages")
Rel(SPA, Support, "Shows on support button press")
Rel(SPA, Welcome, "Start page routes to")
Rel(SPA, Login, "Logs in using")
Rel(SPA, Profile, "Uses have a")
Rel(SPA, Register, "Registers users with")
Rel(SPA, CreateContent, "Creates content with")
Rel(Home, ViewContent, "Views content with")
Rel(ViewContent, ContentModule, "Is Part of")
Rel(CreateContent, ContentModule, "Is Part of")
Rel(SPA, CreateCollection, "Creates content with")
Rel(SPA, CollectionModule, "Creates content with")
Rel(ViewContent, Comments, "Contains")
Rel(Comments, SocialModule, "Is Part of")
Rel(Login, AuthenticationModule, "Is Part of")
Rel(Register, AuthenticationModule, "Is Part of")
Rel(Register, AuthenticationModule, "Is Part of")
Rel(Login, AuthenticationService, "Authenticates using")
Rel(Register, AuthenticationService, "Authenticates using")
Rel(AuthenticationService, ErrorService, "Logs errors using")
Rel(Comments, CommentsService, "GET's and POST's using")
Rel(CreateContent, CreateContentService, "POST's using")
Rel(ViewContent, ViewContentService, "POST's using")
Rel(CreateCollection, CreateCollectionService, "POST's using")
Rel(Home, HomeService, "Gets content and collections using")
Rel(Profile, ProfileService, "Gets all information about users from")
Rel(CommentsService, ErrorService, "Logs errors using")
Rel(CreateContentService, ErrorService, "Logs errors using")
Rel(ViewContentService, ErrorService, "Logs errors using")
Rel(CreateCollectionService, ErrorService, "Logs errors using")
Rel(ProfileService, ErrorService, "Logs errors using")
Rel(HomeService, ErrorService, "Logs errors using")
Rel(AuthenticationService, Server, "Accesses endpoints")
Rel(CommentsService, Server, "Accesses endpoints")
Rel(CreateContentService, Server, "Accesses endpoints")
Rel(ViewContentService, Server, "Accesses endpoints")
Rel(CreateCollectionService, Server, "Accesses endpoints")
Rel(HomeService, Server, "Accesses endpoints")
@enduml

And this produces the following:

This is completely unreadable, is there nothing you can do to fix a diagram like this. Another thing is that when converting to LaTeX none of the items are centered anymore. Hope someone can clarify once again.

> package "Other Groups" {
> FTP - [Second Component]
> note left
>  You can use images
> <img:D:\TensorBoard\DB2-Setup.jpg{scale=0.3}>
> end note
> [First Component] --> FTP
> }

This code works if I don't use the C4 plugin.
This also works with the C4 plugin if I don't use the img tag.

Example

@startuml Container Diagram
!includeurl https://raw.githubusercontent.com/RicardoNiepel/C4-PlantUML/release/1-0/C4_Container.puml

Container(c, "My Container", "Application", "Does stuff and things.")

@enduml

Result renders with <size:TECHN_FONT_SIZE>[Application]</size> in the place Application should have been rendered.

I am running the docker plantuml/plantuml-server:jetty image server.

This only started happening recently. I know it was working two weeks ago.