Merge pull request #223 from kirchsth/feature/222_TagNoSpaceAnymore

#222 PlantUML stereotypes support no spaces anymore (update samples)
pull/231/head
kirchsth 4 years ago committed by GitHub
commit 23ce5986ed
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -1,6 +1,6 @@
# C4-PlantUML # C4-PlantUML
![Container diagram for Internet Banking System](https://www.plantuml.com/plantuml/png/hLPRZ-964ttthwXXT_M1n4MVDliIQQHbmCdEYWl1p6pUKDakJ6lRtLPt6mP5-U-fDXW3Cz56IbuGNPTpZgkholvi7HfNvZBu7oHQxSWu40xsmcq1qrGueHLATkKvgXIaK0HeiZ8dvQ0tNeQJuUhnELm_paQJft5ut-gtm6aeBO7K2Kfv2Ex41Zxiq0YC9QtfHLXdswtRp5Od0BWJAf5bIj0VzFk3qK_haLOEcTFq2w_nZgIboxYjSuNzUJ0mkEzdhBcCcTaadCNw-gnwK4XK_lbwrgLIn0pQMtZJqtGooD4wCc_og5HiWY3wCl-sNeJBQ3vRpvzMayTPsEu4mpGD9VaAh31hjs9CldCy93L6gmllDtmOQQdD_Vjm4ax3sMhzovn_HlF9VCd-E3jwM-y-Vlmq7dxoENQB1Ts78jkwIAIKHlxSxbI4Iv8L6Tg3IdomevUQOBXSiimQsL_HtpeYTv1qFqQxfNGYr2sw1n_yDnJQkOOYSC99WdEL8HMO6SnXemqyAaT6aOC7LD-5oY0wM4Tv42p8MAtQIMcTpibqONJ-rnf2RGQz0RSbY3cxUspSeaf4MTa0aqINojaMwpX2hn_OaA8vj9F_CzQjW5O7_WW0eD7RtbEyngBWu6yKmx0ef4ZGpqQBJLznXrs82kF5Jvz7tZOcANYOR2NDEevDuDIMm8DKcS-ySVtWYo6Bl6Qs1J9Sn6v9lGLcvDbhrYWned1T6Agib6YyUM7qJgHa0QLycsLJgkGuri8T_B0cPLL82pk1FaKOuEU5sEYz9VDAKQvZ8UbKZga_d3MDtdNXTyoHAt6j1QJ8XQCKR1bRSdnd_rYRVINkA01Isec4RkMDutQA3cEqvA_XzDUhYNwRmDNPQSFQ_C80GvcmpbHN2a9nM-RL_ovigra1BBcl4aCfAITGsgvlAx8MfCxuG2xflohKQJ5mfOJlsCNZsuqprXncchpBolseGhue35nDAsRs_lKoObL_dli-V75job78jQqCp1Jsfdm-pPodNl6zY8eL9Kn5OhJL6mVXIx95bH7OOsJd4lCaha5bJBNX0QUReMxgxlkpReE43VK3NbOVCDQbQtgWUvxbBZY3oc9LYgR-mPBanRveflR9alNSNrQhHSI1rt4yOp-CgRk-WJlIhMV42plMpOweu9eDS4AgZ9STqH1M2xSBN_ajCwZ8c-kiN2U4Hi6_0re_S78ZkvcMQz0bOMfXOtHUBQoz4OuiEEs9JZpZXn53dZ4lgdNJP173Mg2UjrOOZP2RVhpMS9rNMkwFXZwQhXOCT7K7L-atNTdKgNdDyRgQJcvhrRWP_lWDC0b_3MTZVlTlj7Pa83MuLyUNJVqr0Ri-VF0NpXtPxbGryzyQZPUFpxKx-Cmgorp-1G00 "Container diagram for Internet Banking System") ![Container diagram for Internet Banking System](https://www.plantuml.com/plantuml/png/hLPlZzh64txFfvYGH0690_sKNzvKEYaSkCr5S4Snb_GT6di7UvNrhhkxvWvL_UwTDJO-k5IfrBu1x-pEypmxVyR-w3nQNnMgzmvIe_TaFKWFZzBdW498Bur6nLj5WLg0afe0RLOLf3rSpTVHOhgv_H9jR-zcYuTvTDqVzy4Rg1o1CYagTUYzaZjukqShCL6qfIVfl1lqBptxmnx0AwbJLGc2yMGydip-lvqPxP4vxRWC6b-HSlJyNEvzwNwQJ2m-ZZFMN2NCR5FsOdrZLZqf5UfmloldXP89WrwjWkbXkPWKw3pPx_9e8NUzNlpf_kjs5QtZ-xlj_SDcSNiN3OOSgGrc3bnLbiPwq0PSYIava1fyJg2n81Waw4Y0EPegBSXoyAJE872IyOUIt0WUSvdc88n-vrl05WtreJ2MXcDWnjlToMm9BFrU4UE8bb9Hnf97pJzuUcfoM3j1ZYva9I4Gj9EQH6ygHAGeP97lCkWdc7vZnrCO-YDui-F5p2XZhzz4YsWPtMssFz_pp-n-SR_c_IGxxlPVlt__OJxz47nSZYLTHpBBVIm5YJYi1qFUEIhRiB3hbWtIbWu655p01PzXVnZahKdLqj0TT1gm-LAjdkbwpObfXOIY_DkDs1yKNS_HvIGMKhEOC_G0FlblA8pt7KNFIwy8JW458J6pMC3EMBZLdgmc3pUeluMIY0_EKz7hhSWwemTfvRmfo8vWTdhgJw4rWzdLIK_OUtHCSraxegfjW6bgAkrTdtKSeRStR11e3uFqVunrAQ0_X3zw0D3f7JnIiiMovCDVAO5fMIgPOfW6VJPznZsE82vj4B_yCWksEIcvPncrDEVvR0fD8m9gKPjFl4bxyTMKHPupkn8PBkPjHLShp2YmjwnnQcNfHp3LMQNG1lFAchqKeJEK-ZxBhjBfSP19Vm1lE99r81ti9GONQO7l2uarZuxi2qM5IQIY9XpBi3XfchqUmMzO84VYN0ieMSZGeQvA77dEsJ_Mvbw8Eme0GNkPqgMyUJ8Gw37Ccv26vZ6eYNzTmDdQ6qiEmeW4IvbqtjOf1QcvB8lwUGHvtIk0bSyXjIH8UudAZK9PaNEWJCOBykduHQ2QnkP8oL2ngzll5yxSy37R-Pr5xWSH2a5XuBfRCNFNBqONY_hpLFRHanzGWL9jNMrWekXgoUkcvGBp9YUGDIagMChK6cTs7gAdD4UT4Hmz6VOPPgEjGsLClRDOq4LFTs4FvTbMGSg6zdxFWm-OcCft9J0wjV88l4Nji8v45_xUcjIpST4rxOCZ5xW_RJQhc0-UdtCb_l1CK_GTN4EtlGkpEZ7TYAZXkW7G8DN6yu9e2UjvEuBF_5gTrEHTDkkj1g5JyE-0jZVitCdkckKST4qe7EoiAUfvzMYb9mVU1AA6PtupOyWJvhDeNHHPpB0Ew2fOQunEo7azdccuzAiSrqT77oytAmOwoy6P-qLLTd7gtd8yhPQBorXrsmn__EXPHBz4T_F1iBSpnfC5OV5H7zyrxUSJxCVmDYHS6ZqOrZ7hFgx2BY-_jDkzZwooAjHV "Container diagram for Internet Banking System")
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 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.
@ -523,7 +523,9 @@ AddElementTag("v1.1", $fontColor="#ffffbf", $borderColor="#ffffbf")
AddElementTag("v1.0&v1.1", $fontColor="#fdae61", $borderColor="#fdae61") AddElementTag("v1.0&v1.1", $fontColor="#fdae61", $borderColor="#fdae61")
AddElementTag("fallback", $bgColor="#444444") AddElementTag("fallback", $bgColor="#444444")
AddElementTag("micro service", $shape=EightSidedShape()) ' If spaces are requested in the legend, legend text with space has to be defined (incl. all other additional details)
AddElementTag("microService", $shape=EightSidedShape(), $legendText="micro service (eight sided) (no text, no back color)")
' If no special tag names should be displayed in legend, no explicit legend text definition is required (all additional details are automatically calculated)
AddElementTag("storage", $shape=RoundedBoxShape()) AddElementTag("storage", $shape=RoundedBoxShape())
UpdateRelStyle(black, black) UpdateRelStyle(black, black)
@ -537,7 +539,7 @@ Container(api, "API", "java", "Handles all business logic (incl. new v1.1 extens
Container(spa2, "SPA2", "angular", "The main interface that the customer interacts with via v1.0", $tags="v1.0+fallback") Container(spa2, "SPA2", "angular", "The main interface that the customer interacts with via v1.0", $tags="v1.0+fallback")
Container(spaAdmin2, "Admin SPA2", "angular", "The administrator interface that the customer interacts with via new v1.1", $tags="fallback+v1.1") Container(spaAdmin2, "Admin SPA2", "angular", "The administrator interface that the customer interacts with via new v1.1", $tags="fallback+v1.1")
Container(services, "Services", "techn", $tags="micro service") Container(services, "Services", "techn", $tags="microService")
Container(fileStorage, "File storage", "techn", $tags="storage") Container(fileStorage, "File storage", "techn", $tags="storage")
Rel(spa, api, "Uses", "https") Rel(spa, api, "Uses", "https")
@ -553,7 +555,7 @@ SHOW_LEGEND(false)
@enduml @enduml
``` ```
![merged tags](https://www.plantuml.com/plantuml/png/jLLHRzCm47xlhp01JQswjMkOc8GqQMCh36d0r6xYSRh4byJWs97jTEFVOyTrI9l0nCFwOllkk-_Ed-_ISsr0cRhaerTCfBocI0fZAlr-FbVmECkPAUgargXIAGmACqjbEQyu21Tpf0tbB9bVdXpTEjFzbvjv2TgWigQ7Ini1JA2QLOv_T5zHCBZaM5gUjVd5SLoXqb8SaZUPnLvABjLPb2j44Kr65vHkiNUGZwFDOdOSxI9VqzEtn_6fioPIKLIxza6EnJv7Pdz9rkVmzk4w3WQ9AE2xHP_8s_j46N2UGFgpYSW3-gJvMVG-l6IfaaIZsh0KNOmkeCAp9SiBisOKwTgTnvDU7csaWhmJifAriFWFyYc4XBTP8VVlad1Rs25fbeRGUZoPpzzSq-1JkBn26WtXOeVZJE0pkCL12EWJ3rACskOQwmeEIRI-lOZi0YAlEIYtlIkGb1P2c32eCaYHc08CCTQUrbQL4fNtGMeqUMIc81i693IQWLoV-RQRxAQxe2KJDaEpak7Cu7nC6mLM_lyjGU0Z2ItMbh7OAGCgvYgu_UmI_e0DkFKQ1EMe2N1ExD1QeDQ4ovobPEocUzOo4oin2isaq9DEbj3RKxURkjt-tMElTVnYOa_3N0og7dTbZrzUzr1CqA9RakzOxGJPRbqH1jD2j0HxOzkzKiOuhlrish2FzaJ2gFPfWiTMi4BkUzwtmBtsUPkljlLxjrVh7vY76q-oVL8__ptGgaCLTd-1D_WhtvSTQMgREfmNZSYcO9gam7ddTbk_fNcU9Nw69MvP_X3iQfr8KxJiZUXs6IRjVw2cmJBjv1kjhxzzVxXPVbf-lHfdm3LEHkSegFlV-mq0 "merged tags") ![merged tags](https://www.plantuml.com/plantuml/png/jLLHRzis47xthxXvGsV1hbrxnGeC2D0ipTO2sHR42VOOdCIpn8qYDVBa9Fz-Hz4AvCfRq8Vw8PJ8xxxxxjCTypumUcvhC_b6syAqYg1YRi9FgvN7XsMfkMhpDf0ld6Mol2nSlMeCsXZpEh0oEbzTl7rz7RVkVhjQrHYOl6pTNqW4Qaj-sKJ-oLsZaEdIK2qyMtuoD6l81sSNyDrEi1VEE7ysBJsHdMQJSwKEs5iiPzFzUlbcUepyLhtxuStcNTpDdLVaZ_TFSgm_vzZ9Bz-DETB-QHslJX8ff1_NOwAqFoRQeJ4v5dzt4MMFVjlz13tv7Zxj83HOK03q19x-QIamAT0Mk28mL99LYyCAJ8yC3vgh50GL1c07EO6YdROIDujVU0cI5vmGU42bD6jdqGY6KPimKbdhmhij-RqkA2eD5JPqTgdBYhTQaTh6zrac9qd6hQWuIr4GKXZCAC8XH7m6C-iwhGkGXsW05B7sR9gbacKtD5HeDC1OWiMQ0eJAjKPrnUZG67nADlGMI0mzDaONceTsfCgx4a67pa7jen5YmRZuP3Esx6faNGZc2UHlqHhaAFnpQm8xZ-N0bHlNMYdnP_TuS2Nhc_w6J6hut4Z12-YMpcivIMJ9gwv_H7hVLQ9sUWgtYJYZBRs0Mx_g0yR49oacprCx2mqkOBgzFf_AWhOK7tnylAq8Qe60jan-5tkDA-Ik9uisY7taqnaM759BxZL2Fy6CPJXByvmTfpjNjRQIeLlXT6QCPpgmHx7_IoLOUe0qkmCPwoCPsEYeuFfJJFWNxZ6k7z4gGw4RdRmD0Wm1Z2jrqGzLpmnYCTcWdGtPKPPqQSpZqtoKL6hV9AytNytiUN_Xd7HzCxHzy_LzxyNqNWmbfOuDqP33OnJ1L5JscU3uOXfMjDE6jcaq9UeNUOD-KiSi_Oa8aCb9BPywu2wajDr_GpbFnyci_y7SNoMImnTDupy2tGoe-gV_W7Vu3waj1ywqahf_NtSUSwK3n5jhK5qwZ_w-pB9vWMNJimm-qB7NkUFgcRqpNPRJfEFxQTxlp0Vv9jkFV_nvVtNvw-Nl7sRICe6ooNkoggtDlm00 "merged tags")
**Sample with tag dependent sprites and custom legend text** **Sample with tag dependent sprites and custom legend text**
@ -785,7 +787,7 @@ Source: [C4_Container Diagram Sample - techtribesjs.puml](samples/C4_Container%2
Source: [C4_Container Diagram Sample - message bus.puml](samples/C4_Container%20Diagram%20Sample%20-%20message%20bus.puml) Source: [C4_Container Diagram Sample - message bus.puml](samples/C4_Container%20Diagram%20Sample%20-%20message%20bus.puml)
![messagebus](https://www.plantuml.com/plantuml/png/bLLDZzis4BtxLqpL7ho0TuqKFHLO8FumcWJUNSUoaQCmeiOI4OeaICgkM_I_bvHiXN7LJRA7jJYSUU_D38TyQnqQrzG2afginPBonYQZdxXaeYa8AkUq_NqwDNXwABch6hzDXYdfIBe7fkgf5YW3mBrrXU3vTF7R_IQOza_hQOtMaV6cRE4Za4io3zhxZaQpebW9gZt83ijnKdDc57Za8sUKJE0NMw6cnnKlAvVoWeeqhCTtVYSl5qeeyvWib947eKvavg9fWmwUvB9vghYZvEwMnpfbi8mOjggH7dwk_XnW42tzv_Ch-AFqtSkdRBFQfY_FsSj-jtx_l1fxyuQCLNBC6izOavd0elzAPd0rjm1dwwZEva48clEOlV4kLszuBm_ArEYuaiaT_3q2_zVNSenQnyuphGLddREtVy0ZMcQuTXEOoR8HQ89v9dpHRA_1WbDGeyIIm5N43MYZ3bpux6xOhX7PfKynTTgPhhGJIBNXieIvKYuOTnM1LbmwK0T0niXQy9drAe17YVfIEomjFCBDmRXLT3coMTvOp_7KhM3Us42vnJpdxkbZIszGMgsCQqczEvT10Hr9EliVM4F1rSkFCjrURN6gsoO_Xz-58NHaGOOK1BTKG84EMx8U37HZjB9alpy_R0hk8X6pi8u5B7wUFZolTk5pOzIH5sH1cH8bjsqfxq_U12rCK710neN__04Do_nBtuiyRlaI7UPeMnql1faWUFCh2wlKAKFscxtjXd60CMg0funh7tC-dTEFwuWEh-N_Ymeuah6UhZrjGlGT_z8MBA1IxBNkn0g7--9teww4LP2pEfBibxswg0Q0kMhSvV21gz11XKVo_xGcISMmWdz6eos9R1dTATtuxplHoRlTRfDwnywhtHkOsBqkqFrFSo1KgGnOQC-IJU23lzMcCUv-u1BeLAGa2zldf0B89yfJnJwJUoKuck0Uf9VMj5eZq1Pd02KweNt5krRpxYPSpXUNuAy81mRzEpN4CDry_J3407bl6aoa2xiXYuzY7z5HTJ6ZDPwpxH3RLqZNfsoz-cFrlFHFs5kVH7Yg_mK0 "messagebus") ![messagebus](https://www.plantuml.com/plantuml/png/ZLNVRzis47xtNt7p1am6d1WTzZGWGFt3M5iuYMlPwADn4iyIKOeaICgfD-n_7odPAjqegFEGaCUxx_lkFb9vRnqQLrTYy0kNkQWPGUcSjdzD9WPVxWlkoZghBPbSIKVItUUgccY1CjJSMSS4poRpF-_M8RHxN4qgj8wC3-tdlWAv97El0_xlK4jVN7aGS2N1GGcXNhWiGFWaGCdWwfWRwrSAF3a8bQCG9u_HgNnDC9WojXGK4BPO9CEAvqQbP8uyf-4OVhCbQdfOyg9qAMV4qh1FHluaA-PAAFCmd2iZ3ruLcPcecwA3vpWVlfJSDJ511KcsfM_keIK1sx90GW4TR80V3KS_Ah9E6ImYCHjLIvywKzzwn8X6wTVJMr8y_Y3zyFnblrvkqkUd_VDkk_huj4nyU4t6AfdajMUio8nXtgs6KxY46u2JTLJjPq48cbEIl_CfbspuA0_ALEYuaiCH_3i0_zDDFK6ju-IfreBdRRAFVy8ZsjnmxSOmbKKjq8JmDBXkEmqsM5oXn8A2xTo0Dkh0HUZkckrIiJyFEwRkN6vfnv1g4sxMJ2aNWjkIG2ik7QW3O9wJjU0xwrG0ZnhretPOM7Y0-0gz5bHv52zxdzNMKposEvZLDZ1kCCkuU_pSi1kKLYlZ6awVpcKGG4UIphw2DHHIlVgeqSqb5dUwgRDJ-3itX8uioD21u9OOC7JOa7LWe6kZbILxStjOC-uY3TEmZ_ddlqxkdvRRi5mRTUICB2XJeEIs6UJTYmz10nC4733dmYzlbx38lflEijZl1JhCq3OodWtcWk3T7tdOfKuPiZyrjds9VOpTn09bFFcOy_6KVbv5T7WP_Z_4u4Z6UhhcgWdH-VtT56HGghp7crw5_RRuqyYKi0jobaUItRPJ5yq0C5ErEryzS2KwAF58_fVM98drA_XlCDYGs2-Y3qhxzdUjwE67xNQT-iHpMdFOyrvtcg5xmnq8Ooe26DgJpCVmoN_J9bV0k-GrPgiZ9SbirvKAA5yeIrN-bPolVgiuUi4TIAUjRiH6e0rE3qfqHxkPjsRpzaEucCtFBIHNZ7ql_JOHCKpxmcw7k4ZfOUz2lQsqr3-mnTUngsYvsfh12a_xJH_R5TBbVzbg-VVoQP6C1kzz5tKb_WS0 "messagebus")
## Background ## Background

@ -7,7 +7,9 @@
!endif !endif
SHOW_PERSON_OUTLINE() SHOW_PERSON_OUTLINE()
AddElementTag("backend container", $fontColor=$ELEMENT_FONT_COLOR, $bgColor="#335DA5", $shape=EightSidedShape()) ' Tags support no spaces in the name (based on the underlining stereotypes, which don't support spaces anymore).
' If spaces are requested in the legend, legend text with space has to be defined
AddElementTag("backendContainer", $fontColor=$ELEMENT_FONT_COLOR, $bgColor="#335DA5", $shape=EightSidedShape(), $legendText="backend container (eight sided)")
AddRelTag("async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DashedLine()) AddRelTag("async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DashedLine())
AddRelTag("sync/async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DottedLine()) AddRelTag("sync/async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DottedLine())
@ -20,7 +22,7 @@ System_Boundary(c1, "Internet Banking") {
Container(spa, "Single-Page App", "JavaScript, Angular", "Provides all the Internet banking functionality to cutomers via their web browser") Container(spa, "Single-Page App", "JavaScript, Angular", "Provides all the Internet banking functionality to cutomers via their web browser")
Container(mobile_app, "Mobile App", "C#, Xamarin", "Provides a limited subset of the Internet banking functionality to customers via their mobile device") Container(mobile_app, "Mobile App", "C#, Xamarin", "Provides a limited subset of the Internet banking functionality to customers via their mobile device")
ContainerDb(database, "Database", "SQL Database", "Stores user registration information, hashed auth credentials, access logs, etc.") ContainerDb(database, "Database", "SQL Database", "Stores user registration information, hashed auth credentials, access logs, etc.")
Container(backend_api, "API Application", "Java, Docker Container", "Provides Internet banking functionality via API", $tags="backend container") Container(backend_api, "API Application", "Java, Docker Container", "Provides Internet banking functionality via API", $tags="backendContainer")
} }
System_Ext(email_system, "E-Mail System", "The internal Microsoft Exchange system") System_Ext(email_system, "E-Mail System", "The internal Microsoft Exchange system")
@ -41,4 +43,4 @@ Rel_Neighbor(backend_api, banking_system, "Uses", "sync/async, XML/HTTPS", $tags
SHOW_LEGEND() SHOW_LEGEND()
footer drawn with PlantUML v. %version() and C4-PlantUML v. C4Version() footer drawn with PlantUML v. %version() and C4-PlantUML v. C4Version()
@enduml @enduml

@ -12,15 +12,15 @@ AddElementTag("shadowed", $shadowing=true)
AddElementTag("shadowed2", $shadowing=false) AddElementTag("shadowed2", $shadowing=false)
AddElementTag("yelloTagged", $fontColor=yellow, $borderColor=yellow) AddElementTag("yelloTagged", $fontColor=yellow, $borderColor=yellow)
AddElementTag("greenTagged", $borderColor=green, $bgColor=green) AddElementTag("greenTagged", $borderColor=green, $bgColor=green)
AddElementTag("tagged container", $fontColor=white, $bgColor=$CONTAINER_BG_COLOR, $borderColor=$CONTAINER_BORDER_COLOR) AddElementTag("taggedContainer", $fontColor=white, $bgColor=$CONTAINER_BG_COLOR, $borderColor=$CONTAINER_BORDER_COLOR)
AddElementTag("tagged person", $fontColor=white, $bgColor=$PERSON_BG_COLOR, $borderColor=$PERSON_BORDER_COLOR) AddElementTag("taggedPerson", $fontColor=white, $bgColor=$PERSON_BG_COLOR, $borderColor=$PERSON_BORDER_COLOR)
Container(c2, Container 2, tech, $tags="tagged container", "'tagged container' stereotype/tag overwrites all styles of container ($fontColor, $bgColor and $borderColor) the container is not important anymore and therefore not displayed in legend") Container(c2, Container 2, tech, $tags="taggedContainer", "'taggedContainer' stereotype/tag overwrites all styles of container ($fontColor, $bgColor and $borderColor) the container is not important anymore and therefore not displayed in legend")
Person(p2, p2, $tags="tagged person", "produces no person legend entry too") Person(p2, p2, $tags="taggedPerson", "produces no person legend entry too")
Person(p4, p4, $tags="yelloTagged", "'yelloTagged' stereotype/tag first and defines $fontColor and $borderColor (in legend), 'person' defines additional $bgColor (in legend too)") Person(p4, p4, $tags="yelloTagged", "'yelloTagged' stereotype/tag first and defines $fontColor and $borderColor (in legend), 'person' defines additional $bgColor (in legend too)")
Component(comp3, comp3, "techn", $tags="yelloTagged+greenTagged+shapeRound+shapeOct+shadowed+shadowed2", "Complex sample with all styles") Component(comp3, comp3, "techn", $tags="yelloTagged+greenTagged+shapeRound+shapeOct+shadowed+shadowed2", "Complex sample with all styles")
SHOW_LEGEND(false) SHOW_LEGEND(false)
@enduml @enduml

@ -56,7 +56,7 @@ Source: [C4_Deployment Diagram Sample - bigbankplc-details.puml](C4_Deployment%2
Source: [C4_Container Diagram Sample - bigbankplc-styles.puml](C4_Container%20Diagram%20Sample%20-%20bigbankplc-styles.puml) Source: [C4_Container Diagram Sample - bigbankplc-styles.puml](C4_Container%20Diagram%20Sample%20-%20bigbankplc-styles.puml)
![Container diagram for Internet Banking System](https://www.plantuml.com/plantuml/png/hLPDZzis4BtxLqoT71n0kqQHvb9WWNXjjTd0NhkMj-dD655ZcGX52YIr7oZwtpkaFsXxKwH0UrcOGyvxJq-Fe_teF5hVDQhtWzH2THN1rllM_JmSMdowhgNVTcNdo0gZFMb_BKmpR1Ngq7FbVALaEHp_TBK8fOVPTDYWysIvj1vp1qfDzheD-BtYq_pBUf4lY_dzUlwmcjxTvuDtlL5LvOeQXbvXFUYNABwIha0ScliPlDtmOcoKiJTlysa-o-zNwr_c_6SydywNl5_Mkzt-c_VlFqn67qAFss9BDxcijxwG5LL5M0_UHS8bgKY6xaMBSDZJyu5Wj5oop0EoOWd_k57u5qKt4tHRggQyla0FuCF_Xy9udoXwNdf5SBGNAecrnGOsniATPlSrURX5_LNg6eeNvwdfzHPadT43qJbl6h8PZ8-_-YCubC5im6y9IkxEu8dVFhIn4LMi0GfXEkrTdtNieDUtNAZGlWp4ZunrAQ3_3lxi0K3IEtYYSerjouU_K0cZjbLIe9T6zxdq6HynWwArGVpizt6eJKZ9HvOHfJdFPmNiymYegrW-yfQ71r-CMEGviskHuGhULdIrm9e2-u6r45QsFeEHhZk5DfGNrZnoU1oWKjzcsNHQ1Ecef7y1RzZ9QAI3HucXHLhWvuNIcYT7zfMYnfHIqTwEMLWSDOtVPF07DiXEd6i19Hl9WG3NbOwrcCs_rkPUYTi9W8eUfQ1BUPDoKA774Xs5rx3_6TGKlqtXREsDPMrXKe2bMZflCN23r1pB9lxEO1ll2c37kHAMAj9Ued9PY1Kv1yhKl20lhbyPjHyCx9GCYLtSVJiu4yF7REexTUvx3WLJ63ZULgpTpUjXnAh-EkO-V_O3Qb2gjOi5PiglPho6tO50lTeIoCYA2cPIMEFCnaF-BBQeQu9T9yEUOEx59TGPieaM6xgurCdtaCz330GN3WzuwZvWQJgVCf0Txt86tg9s6Ar8_lUMf4xcHRgr3uvSuFwqMYqAFdX-phNutJCfzOUZExhrFV70BasQ4H4kJO0zKYoU9Y8Hne6RmMV-oWmZUNgTSMkFa1JyDw3rBJSdsOVRSWcw9AmSRAnfui1wijAJ0sy2qPvdSZjco2FcYLiN8IiOrW5TXMh4I48kydYguRAlSvoFH5_CLeiTK7gOi_QBL2QVqcUEnzLiUkbLscRutVy0q_pN_7x2t_wFZDurwcy0 "Container diagram for Internet Banking System") ![Container diagram for Internet Banking System](https://www.plantuml.com/plantuml/png/hLPTRzis57tthxXp--00IeoXwyk007LiRMrXnvxbh7iphgXhcIX52YIL3mpxxxjaP2boEdJ0zXA8bxpd71uUqldWF5hVL6hqWzH2DGN1qVlQ_JoTMdouAgK_DddZo0gZFMb_9KmrhHNgq7FfVA5aFft_TBa9fRlLSbgXysIvj9zp1qfDzgeE-AFiu_hBVfDki_NjVdstMtwwJISNerbHf8egXjvXEHddABwIBhhUSG9l3poO6sNizTjqcQxIszt-bpN_cQ-NwotFv-NpxFZDktVl5xFteSSTiQRhL9P7dyc2YYoC9nSyewXaWXqz-kiJ6uWJ7Kmej80BFHVZA6zBAaf3zwH5mFRSs-gPRRUygPCGnH3_E97v9qNN2tH7AfPIivW1UW2V_ZyKnlkUOkIbLmITeL18B2rMS30MFcbFLfE76zHVfIuXUtAUgj5eGzOPFH6DywOYcy2y-nhFu5G6Sm1_9CYvEu47pWhKiH5Lh04AOHhjtPXrF4FlRxXGe7sQY1yPwrp0-0B-7050htVoGFaUwveNVw4SPdMjf40lZHvpwJFUOm9PROFurU_pK5kGalSi8qfpdjSAQDCBg8jOxdZpqyOtCnOvP7OrCbp6quekDrXIO3-nPiBAsYSmqsMZq8Ronffxpeq3LEhRB8T6Yo0TbVHFu0qx6OrqS2ynj4WBl5_8hNbmP5yfgamk5RLshCAWqpH_ay0VM24xCTG2IbQI0m6koHrvFhD_hSsz4lSi00gwbuBEvItoIO4UStGKZg7z36gotvOm67jZMLjuLy1IAPstyKX1Qevb5RyJECQx0jXmheIbWhINg5mIOaNEWJ8b3yYBgrT6jHURdP8XiPjFtmxEml0os_SDdFkEGy4K1ewt5Kjt_UhfOb5_TR5F7_s4AfHgxsA1YTBB5O_RAnUOTtmiCfAYWfKKrZXpy90-YYFgak2vas5VOBRQUbJ6r0UB5PtTwHUserAd50WkTFjxOJvWRXhVHo3fhd82tg9s69texHzjIRruBlfBU-V81UwFkzqcuuN3TQx6xwvfGz_3jNJxs_1MvwP_8Y9S_m2qIB4u3CI9CBwt2NpcdwHf9EzFCqwr2Bs2_mQql-7cNdP_MOQWMyB2mS6QAhvN3rPwSk1D86fv5ZTpXkmmNxXr5hACOHtGPQX6Z5x888_d6ePzZUDyzFJPQhTXeC4P3DhFKzdvrF_AyMkrMfvxrKyp_FC_3Clqr_HsCRaOVM3qfb9_0m00 "Container diagram for Internet Banking System")
## Icons ## Icons

@ -2,7 +2,7 @@
!include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml !include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml
SHOW_PERSON_OUTLINE() SHOW_PERSON_OUTLINE()
AddElementTag("backend container", $fontColor=$ELEMENT_FONT_COLOR, $bgColor="#335DA5", $shape=EightSidedShape()) AddElementTag("backendContainer", $fontColor=$ELEMENT_FONT_COLOR, $bgColor="#335DA5", $shape=EightSidedShape(), $legendText="backend container (eight sided)")
AddRelTag("async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DashedLine()) AddRelTag("async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DashedLine())
AddRelTag("sync/async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DottedLine()) AddRelTag("sync/async", $textColor=$ARROW_COLOR, $lineColor=$ARROW_COLOR, $lineStyle=DottedLine())
@ -15,7 +15,7 @@ System_Boundary(c1, "Internet Banking") {
Container(spa, "Single-Page App", "JavaScript, Angular", "Provides all the Internet banking functionality to cutomers via their web browser") Container(spa, "Single-Page App", "JavaScript, Angular", "Provides all the Internet banking functionality to cutomers via their web browser")
Container(mobile_app, "Mobile App", "C#, Xamarin", "Provides a limited subset of the Internet banking functionality to customers via their mobile device") Container(mobile_app, "Mobile App", "C#, Xamarin", "Provides a limited subset of the Internet banking functionality to customers via their mobile device")
ContainerDb(database, "Database", "SQL Database", "Stores user registration information, hashed auth credentials, access logs, etc.") ContainerDb(database, "Database", "SQL Database", "Stores user registration information, hashed auth credentials, access logs, etc.")
Container(backend_api, "API Application", "Java, Docker Container", "Provides Internet banking functionality via API", $tags="backend container") Container(backend_api, "API Application", "Java, Docker Container", "Provides Internet banking functionality via API", $tags="backendContainer")
} }
System_Ext(email_system, "E-Mail System", "The internal Microsoft Exchange system") System_Ext(email_system, "E-Mail System", "The internal Microsoft Exchange system")
@ -35,4 +35,4 @@ Rel_Back(email_system, backend_api, "Sends e-mails using", "sync, SMTP")
Rel_Neighbor(backend_api, banking_system, "Uses", "sync/async, XML/HTTPS", $tags="sync/async") Rel_Neighbor(backend_api, banking_system, "Uses", "sync/async, XML/HTTPS", $tags="sync/async")
SHOW_LEGEND() SHOW_LEGEND()
@enduml @enduml

@ -3,7 +3,7 @@
' uncomment the following line and comment the first to use locally ' uncomment the following line and comment the first to use locally
' !include C4_Container.puml ' !include C4_Container.puml
AddElementTag("micro service", $shape=EightSidedShape(), $bgColor="CornflowerBlue", $fontColor="white") AddElementTag("microService", $shape=EightSidedShape(), $bgColor="CornflowerBlue", $fontColor="white", $legendText="micro service (eight sided)")
AddElementTag("storage", $shape=RoundedBoxShape(), $bgColor="lightSkyBlue", $fontColor="white") AddElementTag("storage", $shape=RoundedBoxShape(), $bgColor="lightSkyBlue", $fontColor="white")
SHOW_PERSON_OUTLINE() SHOW_PERSON_OUTLINE()
@ -12,10 +12,10 @@ Person(customer, Customer, "A customer")
System_Boundary(c1, "Customer Information") { System_Boundary(c1, "Customer Information") {
Container(app, "Customer Application", "Javascript, Angular", "Allows customers to manage their profile") Container(app, "Customer Application", "Javascript, Angular", "Allows customers to manage their profile")
Container(customer_service, "Customer Service", "Java, Spring Boot", "The point of access for customer information", $tags = "micro service") Container(customer_service, "Customer Service", "Java, Spring Boot", "The point of access for customer information", $tags = "microService")
Container(message_bus, "Message Bus", "RabbitMQ", "Transport for business events") Container(message_bus, "Message Bus", "RabbitMQ", "Transport for business events")
Container(reporting_service, "Reporting Service", "Ruby", "Creates normalised data for reporting purposes", $tags = "micro service") Container(reporting_service, "Reporting Service", "Ruby", "Creates normalised data for reporting purposes", $tags = "microService")
Container(audit_service, "Audit Service", "C#/.NET", "Provides organisation-wide auditing facilities", $tags = "micro service") Container(audit_service, "Audit Service", "C#/.NET", "Provides organisation-wide auditing facilities", $tags = "microService")
ContainerDb(customer_db, "Customer Database", "Oracle 12c", "Stores customer information", $tags = "storage") ContainerDb(customer_db, "Customer Database", "Oracle 12c", "Stores customer information", $tags = "storage")
ContainerDb(reporting_db, "Reporting Database", "MySQL", "Stores a normalized version of all business data for ad hoc reporting purposes", $tags = "storage") ContainerDb(reporting_db, "Reporting Database", "MySQL", "Stores a normalized version of all business data for ad hoc reporting purposes", $tags = "storage")
Container(audit_store, "Audit Store", "Event Store", "Stores information about events that have happened", $tags = "storage") Container(audit_store, "Audit Store", "Event Store", "Stores information about events that have happened", $tags = "storage")

Loading…
Cancel
Save