#102, #94, #51: Add custom tags/stereotypes support; dynamic legend supports custom colors, border and shadow; dynamic legend displays (only) used elements, tags/stereotypes.

New added macros: SHOW_DYNAMIC_LEGEND(), AddTagSupport(), UpdateSkinparamsAndLegendEntry(), elements macros are extended with $tags="..."
5 years ago · b63db7ee9b
parent 00e25d6a1e
commit b63db7ee9b
9 changed files with 420 additions and 178 deletions
--- a/C4.puml
+++ b/C4.puml
@ -4,8 +4,15 @@
 ' ##################################
 !global $ELEMENT_FONT_COLOR = "#FFFFFF"
 !global $ARROW_COLOR = "#666666"
 !global $BOUNDARY_COLOR = "#444444"
 !global $LEGEND_FONT_COLOR = "#FFFFFF"
 !global $LEGEND_TITLE_COLOR = "#000000"
 !global $LEGEND_UNDEFINED_BK_COLOR = "#87AECA"
 !global $LEGEND_UNDEFINED_FONT_COLOR = "#B7DEFA"
 ' Styling
 ' ##################################
@ -37,19 +44,165 @@ skinparam queue {
 }
 skinparam Arrow {
-    Color #666666
+    Color $ARROW_COLOR
-    FontColor #666666
+    FontColor $ARROW_COLOR
    FontSize 12
 }
 skinparam rectangle<<boundary>> {
    Shadowing false
    StereotypeFontSize 0
-    FontColor #444444
+    FontColor $BOUNDARY_COLOR
-    BorderColor #444444
+    BorderColor $BOUNDARY_COLOR
    BorderStyle dashed
 }
 ' Legend and Tags
 ' ##################################
 !global $tagDefaultLegend = ""
 !global $tagCustomLegend = ""
 !unquoted function $toStereos($elementType, $tags)
  !if (%strlen($tags) == 0)
    !$stereos = '<<' + $elementType + '>>'
 %set_variable_value("$" + $elementType + "Legend", %true())
    !return $stereos
  !endif 
  !$stereos = ''
  !$brPos = %strpos($tags, "+")
  !while ($brPos >= 0)
    !$tag = %substr($tags, 0, $brPos)
    !$stereos = $stereos + '<<' + $tag + '>>'
 %set_variable_value("$" + $tag + "Legend", %true())
    !$tags = %substr($tags, $brPos+1)
    !$brPos = %strpos($tags, "+")
  !endwhile
  !if (%strlen($tags)>0)
    !$stereos = $stereos + '<<' + $tags + '>>'
 %set_variable_value("$" + $tags + "Legend", %true())
  !endif
  ' has to be last, otherwise PlantUML overwrites all tag specific skinparams
  !$stereos = $stereos + '<<' + $elementType + '>>'
 %set_variable_value("$" + $elementType + "Legend", %true())
  !return $stereos
 !endfunction
 !function $elementTagSkinparams($element, $tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
  !$elementSkin = "skinparam " + $element +"<<" + $tagStereo + ">> {" + %newline()
  !if ($fontColor!="")
    !$elementSkin = $elementSkin + "    StereotypeFontColor " + $fontColor + %newline()
    !$elementSkin = $elementSkin + "    FontColor " + $fontColor + %newline()
  !endif
  !if ($bgColor!="")
    !$elementSkin = $elementSkin + "    BackgroundColor " + $bgColor + %newline()
  !endif
  !if ($borderColor!="")
    !$elementSkin = $elementSkin + "    BorderColor " + $borderColor+ %newline()
  !endif
  !if ($shadowing == "true")
    !$elementSkin = $elementSkin + "    Shadowing<<" + $tagStereo + ">> " + "true" + %newline()
  !endif
  !if ($shadowing == "false")
    !$elementSkin = $elementSkin + "    Shadowing<<" + $tagStereo + ">> " + "false" + %newline()
  !endif
  !$elementSkin = $elementSkin + "}" + %newline()
  !return $elementSkin
 !endfunction
 !unquoted procedure $defineSkinparams($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
  !$tagSkin = $elementTagSkinparams("rectangle", $tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
  !$tagSkin = $tagSkin + $elementTagSkinparams("database", $tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
  !$tagSkin = $tagSkin + $elementTagSkinparams("queue", $tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
 $tagSkin
 !endprocedure
 !function $tagLegendEntry($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
  !$tagEntry = "|"
  !if ($bgColor!="")
    !$bg = $bgColor
  !else
    !$bg = $LEGEND_UNDEFINED_BK_COLOR
  !endif
  ' named colors have to start with # too 
  !if (%substr($bg, 0, 1) != "#")
    !$bg = "#" + $bg
  !endif
  !$tagEntry = $tagEntry + "<" + $bg +">" 
  ' <U+25AF> ..white rectangle
  !if ($borderColor!="")
    !$tagEntry = $tagEntry + "<color:"+$borderColor+"><U+25AF></color> "
  !else
    !$tagEntry = $tagEntry + "<color:"+$bg+"><U+25AF></color> "
  !endif
  !if ($fontColor!="")
    !$tagEntry = $tagEntry + "<color:"+$fontColor+">"
  !else
    !$tagEntry = $tagEntry + "<color:"+$LEGEND_UNDEFINED_FONT_COLOR+">"
  !endif
  !$tagEntry = $tagEntry + " " + $tagStereo + " "
  !if ($shadowing == "true")
    !$tagEntry = $tagEntry + "(shadow) "
  !endif
  !if ($shadowing == "false")
    !$tagEntry = $tagEntry + "(no shadow) "
  !endif
  !if ($fontColor == "" && $bgColor == "")
      !$tagEntry = $tagEntry + "(no font, no back color) "
  !else 
    !if ($fontColor == "")
      !$tagEntry = $tagEntry + "(no font color) "
    !endif
    !if ($bgColor == "")
      !$tagEntry = $tagEntry + "(no back color) "
    !endif
  !endif
  !$tagEntry = $tagEntry + "</color> "
  !$tagEntry = $tagEntry + "|"
  !return $tagEntry 
 !endfunction
 !unquoted procedure $addTagToDynamicLegend($tagStereo, $bgColor="", $fontColor="", $borderColor="", $shadowing="")
  !$tagEntry = $tagLegendEntry($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
 %set_variable_value("$" + $tagStereo + "LegendEntry", $tagEntry)
  !$tagCustomLegend = $tagCustomLegend + $tagStereo + "\n"
 !endprocedure
 !procedure $showActiveLegendEntries($allDefined)
  !$brPos = %strpos($allDefined, "\n")
  !while ($brPos >= 0)
    !$tagStereo = %substr($allDefined, 0, $brPos)
    !$allDefined = %substr($allDefined, $brPos+2)
    !$brPos = %strpos($allDefined, "\n")
    !if (%variable_exists("$" + $tagStereo + "Legend"))
 %get_variable_value("$" + $tagStereo + "LegendEntry")
    !endif
  !endwhile
  !if (%strlen($allDefined)>0)
    !$tagStereo = $allDefined
    !if (%variable_exists("$" + $tagStereo + "Legend"))
 %get_variable_value("$" + $tagStereo + "LegendEntry")
    !endif
  !endif
 !endprocedure
 ' used by new defined tags
 !unquoted procedure AddTagSupport($tagStereo, $bgColor="", $fontColor="", $borderColor="", $shadowing="")
 $defineSkinparams($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
 $addTagToDynamicLegend($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
 !endprocedure
 ' used by existing elements like person, ...
 !unquoted procedure UpdateSkinparamsAndLegendEntry($tagStereo, $bgColor="", $fontColor="", $borderColor="", $shadowing="")
 $defineSkinparams($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
  !$tagEntry = $tagLegendEntry($tagStereo, $bgColor, $fontColor, $borderColor, $shadowing)
 %set_variable_value("$" + $tagStereo + "LegendEntry", $tagEntry)
 !endprocedure
 ' tags/stereotypes have to be delimited with \n 
 !unquoted procedure SetDefaultLegendEntries($tagStereoEntries)
  !$tagDefaultLegend = $tagStereoEntries
 !endprocedure
 ' Layout
 ' ##################################
@ -72,16 +225,34 @@ top to bottom direction
 left to right direction
 !endprocedure
 ' has to be last call in diagram
 !unquoted procedure SHOW_DYNAMIC_LEGEND($hideStereotype="true")
 !if ($hideStereotype=="true")
 hide stereotype
 !endif
 legend right
 |<color:$LEGEND_TITLE_COLOR>**Legend**</color> |
 $showActiveLegendEntries($tagDefaultLegend)
 $showActiveLegendEntries($tagCustomLegend)
 endlegend
 !endprocedure
 ' Boundaries
 ' ##################################
-!unquoted function Boundary($alias, $label)
+!function $getBoundary($label, $type)
-!return 'rectangle "=='+$label+'" <<boundary>> as '+$alias
+  !if ($type == "")
-!endfunction
+    !return '==' + $label
-!unquoted function Boundary($alias, $label, $type)
+  !endif
-!return 'rectangle "=='+$label+'\n<size:'+$TECHN_FONT_SIZE+'>['+$type+']</size>" <<boundary>> as '+$alias
+  !if (type != "")
    !return '==' + $label + '\n<size:' + $TECHN_FONT_SIZE + '>[' + $type + ']</size>'
  !endif
 !endfunction
 !unquoted procedure Boundary($alias, $label, $type="", $tags="")
 rectangle "$getBoundary($label, $type)" $toStereos("boundary", $tags) as $alias
 !endprocedure
 ' Relationship
 ' ##################################
--- a/C4_Component.puml
+++ b/C4_Component.puml
@ -11,6 +11,7 @@
 ' ##################################
 !global $COMPONENT_FONT_COLOR = "#000000"
 !global $COMPONENT_BG_COLOR = "#85BBF0"
 !global $COMPONENT_BORDER_COLOR = "#78A8D8"
 !global $EXTERNAL_COMPONENT_BG_COLOR = "#CCCCCC"
@ -19,51 +20,14 @@
 ' Styling
 ' ##################################
-skinparam rectangle<<component>> {
+UpdateSkinparamsAndLegendEntry("component", $COMPONENT_BG_COLOR, $COMPONENT_FONT_COLOR, $COMPONENT_BORDER_COLOR)
-    StereotypeFontColor $COMPONENT_FONT_COLOR
+UpdateSkinparamsAndLegendEntry("external_component", $EXTERNAL_COMPONENT_BG_COLOR, $COMPONENT_FONT_COLOR, $EXTERNAL_COMPONENT_BORDER_COLOR)
    FontColor $COMPONENT_FONT_COLOR
    BackgroundColor $COMPONENT_BG_COLOR
    BorderColor $COMPONENT_BORDER_COLOR
 }
 skinparam database<<component>> {
    StereotypeFontColor $COMPONENT_FONT_COLOR
    FontColor $COMPONENT_FONT_COLOR
    BackgroundColor $COMPONENT_BG_COLOR
    BorderColor $COMPONENT_BORDER_COLOR
 }
 skinparam queue<<component>> {
    StereotypeFontColor $COMPONENT_FONT_COLOR
    FontColor $COMPONENT_FONT_COLOR
    BackgroundColor $COMPONENT_BG_COLOR
    BorderColor $COMPONENT_BORDER_COLOR
 }
 skinparam rectangle<<external_component>> {
    StereotypeFontColor $COMPONENT_FONT_COLOR
    FontColor $COMPONENT_FONT_COLOR
    BackgroundColor $EXTERNAL_COMPONENT_BG_COLOR
    BorderColor $EXTERNAL_COMPONENT_BORDER_COLOR
 }
 skinparam database<<external_component>> {
    StereotypeFontColor $COMPONENT_FONT_COLOR
    FontColor $COMPONENT_FONT_COLOR
    BackgroundColor $EXTERNAL_COMPONENT_BG_COLOR
    BorderColor $EXTERNAL_COMPONENT_BORDER_COLOR
 }
 skinparam queue<<external_component>> {
    StereotypeFontColor $COMPONENT_FONT_COLOR
    FontColor $COMPONENT_FONT_COLOR
    BackgroundColor $EXTERNAL_COMPONENT_BG_COLOR
    BorderColor $EXTERNAL_COMPONENT_BORDER_COLOR
 }
 ' Layout
 ' ##################################
 SetDefaultLegendEntries("person\nsystem\ncontainer\ncomponent\nexternal_person\nexternal_system\nexternal_container\nexternal_component")
 !procedure LAYOUT_WITH_LEGEND()
 hide stereotype
 legend right
@ -97,26 +61,26 @@ endlegend
 !endif
 !endfunction
-!unquoted procedure Component($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure Component($alias, $label, $techn, $descr="", $sprite="", $tags="")
-rectangle "$getComponent($label, $techn, $descr, $sprite)" <<component>> as $alias
+rectangle "$getComponent($label, $techn, $descr, $sprite)" $toStereos("component",$tags) as $alias
 !endprocedure
-!unquoted procedure ComponentDb($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ComponentDb($alias, $label, $techn, $descr="", $sprite="", $tags="")
-database "$getComponent($label, $techn, $descr, $sprite)" <<component>> as $alias
+database "$getComponent($label, $techn, $descr, $sprite)" $toStereos("component",$tags) as $alias
 !endprocedure
-!unquoted procedure ComponentQueue($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ComponentQueue($alias, $label, $techn, $descr="", $sprite="", $tags="")
-queue "$getComponent($label, $techn, $descr, $sprite)" <<component>> as $alias
+queue "$getComponent($label, $techn, $descr, $sprite)" $toStereos("component",$tags) as $alias
 !endprocedure
-!unquoted procedure Component_Ext($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure Component_Ext($alias, $label, $techn, $descr="", $sprite="", $tags="")
-rectangle "$getComponent($label, $techn, $descr, $sprite)" <<external_component>> as $alias
+rectangle "$getComponent($label, $techn, $descr, $sprite)" $toStereos("external_component",$tags) as $alias
 !endprocedure
-!unquoted procedure ComponentDb_Ext($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ComponentDb_Ext($alias, $label, $techn, $descr="", $sprite="", $tags="")
-database "$getComponent($label, $techn, $descr, $sprite)" <<external_component>> as $alias
+database "$getComponent($label, $techn, $descr, $sprite)" $toStereos("external_component",$tags) as $alias
 !endprocedure
-!unquoted procedure ComponentQueue_Ext($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ComponentQueue_Ext($alias, $label, $techn, $descr="", $sprite="", $tags="")
-queue "$getComponent($label, $techn, $descr, $sprite)" <<external_component>> as $alias
+queue "$getComponent($label, $techn, $descr, $sprite)" $toStereos("external_component",$tags) as $alias
 !endprocedure
--- a/C4_Container.puml
+++ b/C4_Container.puml
@ -17,52 +17,14 @@
 ' Styling
 ' ##################################
-
+UpdateSkinparamsAndLegendEntry("container", $CONTAINER_BG_COLOR, $ELEMENT_FONT_COLOR, $CONTAINER_BORDER_COLOR)
-skinparam rectangle<<container>> {
+UpdateSkinparamsAndLegendEntry("external_container", $EXTERNAL_CONTAINER_BG_COLOR, $ELEMENT_FONT_COLOR, $EXTERNAL_CONTAINER_BORDER_COLOR)
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $CONTAINER_BG_COLOR
    BorderColor $CONTAINER_BORDER_COLOR
 }
 skinparam database<<container>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $CONTAINER_BG_COLOR
    BorderColor $CONTAINER_BORDER_COLOR
 }
 skinparam queue<<container>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $CONTAINER_BG_COLOR
    BorderColor $CONTAINER_BORDER_COLOR
 }
 skinparam rectangle<<external_container>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $EXTERNAL_CONTAINER_BG_COLOR
    BorderColor $EXTERNAL_CONTAINER_BORDER_COLOR
 }
 skinparam database<<external_container>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $EXTERNAL_CONTAINER_BG_COLOR
    BorderColor $EXTERNAL_CONTAINER_BORDER_COLOR
 }
 skinparam queue<<external_container>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $EXTERNAL_CONTAINER_BG_COLOR
    BorderColor $EXTERNAL_CONTAINER_BORDER_COLOR
 }
 ' Layout
 ' ##################################
 SetDefaultLegendEntries("person\nsystem\ncontainer\nexternal_person\nexternal_system\nexternal_container")
 !procedure LAYOUT_WITH_LEGEND()
 hide stereotype
 legend right
@ -94,33 +56,33 @@ endlegend
 !endif
 !endfunction
-!unquoted procedure Container($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure Container($alias, $label, $techn, $descr="", $sprite="", $tags="")
-rectangle "$getContainer($label, $techn, $descr, $sprite)" <<container>> as $alias
+rectangle "$getContainer($label, $techn, $descr, $sprite)" $toStereos("container", $tags) as $alias
 !endprocedure
-!unquoted procedure ContainerDb($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ContainerDb($alias, $label, $techn, $descr="", $sprite="", $tags="")
-database "$getContainer($label, $techn, $descr, $sprite)" <<container>> as $alias
+database "$getContainer($label, $techn, $descr, $sprite)" $toStereos("container", $tags) as $alias
 !endprocedure
-!unquoted procedure ContainerQueue($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ContainerQueue($alias, $label, $techn, $descr="", $sprite="", $tags="")
-queue "$getContainer($label, $techn, $descr, $sprite)" <<container>> as $alias
+queue "$getContainer($label, $techn, $descr, $sprite)" $toStereos("container", $tags) as $alias
 !endprocedure
-!unquoted procedure Container_Ext($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure Container_Ext($alias, $label, $techn, $descr="", $sprite="", $tags="")
-rectangle "$getContainer($label, $techn, $descr, $sprite)" <<external_container>> as $alias
+rectangle "$getContainer($label, $techn, $descr, $sprite)" $toStereos("external_container", $tags) as $alias
 !endprocedure
-!unquoted procedure ContainerDb_Ext($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ContainerDb_Ext($alias, $label, $techn, $descr="", $sprite="", $tags="")
-database "$getContainer($label, $techn, $descr, $sprite)" <<external_container>> as $alias
+database "$getContainer($label, $techn, $descr, $sprite)" $toStereos("external_container", $tags) as $alias
 !endprocedure
-!unquoted procedure ContainerQueue_Ext($alias, $label, $techn, $descr="", $sprite="")
+!unquoted procedure ContainerQueue_Ext($alias, $label, $techn, $descr="", $sprite="", $tags="")
-queue "$getContainer($label, $techn, $descr, $sprite)" <<external_container>> as $alias
+queue "$getContainer($label, $techn, $descr, $sprite)" $toStereos("external_container", $tags) as $alias
 !endprocedure
 ' Boundaries
 ' ##################################
-!unquoted function Container_Boundary($alias, $label)
+!unquoted procedure Container_Boundary($alias, $label, $tags="")
-!return Boundary($alias, $label, "Container")
+Boundary($alias, $label, "Container", $tags)
-!endfunction
+!endprocedure
--- a/C4_Context.puml
+++ b/C4_Context.puml
@ -1,6 +1,6 @@
 !include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4.puml
 ' uncomment the following line and comment the first to use locally
-' !include C4.puml
+' !include C4.puml    
 ' Scope: A single software system.
 ' Primary elements: The software system in scope.
@ -11,40 +11,22 @@
 ' ##################################
 !global $PERSON_BG_COLOR = "#08427B"
 !global $PERSON_BORDER_COLOR = "#073B6F"
 !global $EXTERNAL_PERSON_BG_COLOR = "#686868"
 !global $EXTERNAL_PERSON_BORDER_COLOR = "#8A8A8A"
 !global $SYSTEM_BG_COLOR = "#1168BD"
 !global $SYSTEM_BORDER_COLOR = "#3C7FC0"
 !global $EXTERNAL_SYSTEM_BG_COLOR = "#999999"
 !global $EXTERNAL_SYSTEM_BORDER_COLOR = "#8A8A8A"
 ' Styling
 ' ##################################
-skinparam rectangle<<person>> {
+UpdateSkinparamsAndLegendEntry("person", $PERSON_BG_COLOR, $ELEMENT_FONT_COLOR, $PERSON_BORDER_COLOR)
-    StereotypeFontColor $ELEMENT_FONT_COLOR
+UpdateSkinparamsAndLegendEntry("external_person", $EXTERNAL_PERSON_BG_COLOR, $ELEMENT_FONT_COLOR, $EXTERNAL_PERSON_BORDER_COLOR)
-    FontColor $ELEMENT_FONT_COLOR
+UpdateSkinparamsAndLegendEntry("system", $SYSTEM_BG_COLOR, $ELEMENT_FONT_COLOR, $SYSTEM_BORDER_COLOR)
-    BackgroundColor $PERSON_BG_COLOR
+UpdateSkinparamsAndLegendEntry("external_system", $EXTERNAL_SYSTEM_BG_COLOR, $ELEMENT_FONT_COLOR, $EXTERNAL_SYSTEM_BORDER_COLOR)
    BorderColor #073B6F
 }
 skinparam rectangle<<external_person>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $EXTERNAL_PERSON_BG_COLOR
    BorderColor #8A8A8A
 }
 skinparam rectangle<<system>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $SYSTEM_BG_COLOR
    BorderColor #3C7FC0
 }
 skinparam rectangle<<external_system>> {
    StereotypeFontColor $ELEMENT_FONT_COLOR
    FontColor $ELEMENT_FONT_COLOR
    BackgroundColor $EXTERNAL_SYSTEM_BG_COLOR
    BorderColor #8A8A8A
 }
 sprite $person [48x48/16] {
 000000000000000000000000000000000000000000000000
@ -100,6 +82,8 @@ sprite $person [48x48/16] {
 ' Layout
 ' ##################################
 SetDefaultLegendEntries("person\nsystem\nexternal_person\nexternal_system")
 !procedure LAYOUT_WITH_LEGEND()
 hide stereotype
 legend right
@ -144,28 +128,28 @@ endlegend
 !endif
 !endfunction
-!unquoted procedure Person($alias, $label, $descr="", $sprite="")
+!unquoted procedure Person($alias, $label, $descr="", $sprite="", $tags="")
-rectangle "$getPerson($label, $descr, $sprite)" <<person>> as $alias
+rectangle "$getPerson($label, $descr, $sprite)" $toStereos("person", $tags) as $alias
 !endprocedure
-!unquoted procedure Person_Ext($alias, $label, $descr="", $sprite="")
+!unquoted procedure Person_Ext($alias, $label, $descr="", $sprite="", $tags="")
-rectangle "$getPerson($label, $descr, $sprite)" <<external_person>> as $alias
+rectangle "$getPerson($label, $descr, $sprite)" $toStereos("external_person", $tags) as $alias
 !endprocedure
-!unquoted procedure System($alias, $label, $descr="", $sprite="")
+!unquoted procedure System($alias, $label, $descr="", $sprite="", $tags="")
-rectangle "$getSystem($label, $descr, $sprite)" <<system>> as $alias
+rectangle "$getSystem($label, $descr, $sprite)" $toStereos("system", $tags) as $alias
 !endprocedure
-!unquoted procedure System_Ext($alias, $label, $descr="", $sprite="")
+!unquoted procedure System_Ext($alias, $label, $descr="", $sprite="", $tags="")
-rectangle "$getSystem($label, $descr, $sprite)" <<external_system>> as $alias
+rectangle "$getSystem($label, $descr, $sprite)" $toStereos("external_system", $tags) as $alias
 !endprocedure
 ' Boundaries
 ' ##################################
-!unquoted function Enterprise_Boundary($alias, $label)
+!unquoted procedure Enterprise_Boundary($alias, $label, $tags="")
-!return Boundary($alias, $label, "Enterprise")
+Boundary($alias, $label, "Enterprise", $tags)
-!endfunction
+!endprocedure
-!unquoted function System_Boundary($alias, $label)
+!unquoted procedure System_Boundary($alias, $label, $tags="")
-!return Boundary($alias, $label, "System")
+Boundary($alias, $label, "System", $tags)
-!endfunction
+!endprocedure
--- a/C4_Deployment.puml
+++ b/C4_Deployment.puml
@ -6,19 +6,25 @@
 ' ##################################
 !global $NODE_FONT_COLOR = "#000000"
 !global $NODE_BG_COLOR = "#FFFFFF"
 !global $NODE_BORDER_COLOR = "#A2A2A2"
 ' Styling
 ' ##################################
 ' orig was without background
 'UpdateSkinparamsAndLegendEntry("node", $fontColor=$NODE_FONT_COLOR, $borderColor=$NODE_BORDER_COLOR)
 UpdateSkinparamsAndLegendEntry("node", $bgColor=$NODE_BG_COLOR, $fontColor=$NODE_FONT_COLOR, $borderColor=$NODE_BORDER_COLOR)
 skinparam rectangle<<node>> {
    Shadowing false
    StereotypeFontSize 0
    FontColor $NODE_FONT_COLOR
    BorderColor $NODE_BORDER_COLOR
    BorderStyle solid
 }
 ' Layout
 ' ##################################
 ' comment if node should not be added to legend. No dynamic legend extension required
 SetDefaultLegendEntries("person\nsystem\ncontainer\nexternal_person\nexternal_system\nexternal_container\nnode")
 ' Special
 ' ##################################
@ -30,11 +36,8 @@ skinparam rectangle<<node>> {
 ' Elements
 ' ##################################
 !unquoted function Deployment_Node($alias, $label)
 !return 'rectangle "=='+$label+'" <<node>> as '+$alias
 !endfunction
-!unquoted function Deployment_Node($alias, $label, $type)
+!unquoted function $breakLine($type)
 !$multiLine = ""
 !if (%strpos($type, "\n") >= 0)
  !while (%strpos($type, "\n") >= 0)
@ -65,8 +68,19 @@ skinparam rectangle<<node>> {
 !endif
 !if (%strlen($type)>0)
  !$multiLine = $multiLine + $type
 !else
 !endif
-!return 'rectangle "=='+$label+'\n<size:'+$TECHN_FONT_SIZE+'>['+$multiLine+']</size>" <<node>> as '+$alias
+!return $multiLine
 !endfunction
 !function $getNode($label, $type)
  !if ($type == "")
    !return '==' + $label
  !endif
  !if (type != "")
    !return '==' + $label + '\n<size:' + $TECHN_FONT_SIZE + '>[' + $breakLine($type) + ']</size>'
  !endif
 !endfunction
 !unquoted procedure Deployment_Node($alias, $label, $type="", $tags="")
 rectangle "$getNode($label, $type)" $toStereos("node",$tags) as $alias
 !endprocedure
--- a/LayoutOptions.md
+++ b/LayoutOptions.md
@ -53,7 +53,7 @@ Rel(web_app, twitter, "Gets tweets from", "HTTPS")
 ![LAYOUT_LEFT_RIGHT Sample](https://www.plantuml.com/plantuml/png/PL1DIyD05BplhrZheIdKX8edJusXjaAhfKaLJs6RFEt2Vh7xrb34_-uBhLPmBmDlvhsPsMb0uJ5gnPVvwzEsgfUp-whUFCmN5I-5TWhOXJIDYYtmFQ8BjrdcHPU-Izp7NGpW6siG3AQDrPbelHJcGqKNi-BcQgs4mUrgcIc14916TK5g8Gtur94fO_zSan5ZQ_31caIqMfen7-Gzoe1UeFM34IiF0K7NTpQQLlX3qap6V7WCEnpnJyRf_Vea7UnguHpTUO4TpvrJiX4ehHdGgBWSyxnSfu-pYbOyyEjqmbVFHS_bIjakyBvZu6Wv5NI293egbEJ5gquYWkSeDIZo2fJjwvGkmID9Tquo8ja6r4-hSwnje4t2HLMjIrBreb_sV6OEI34wwE7DM_rtPGgcfU_y1W00 "LAYOUT_LEFT_RIGHT Sample")
-## LAYOUT_WITH_LEGEND()
+## LAYOUT_WITH_LEGEND() or SHOW_DYNAMIC_LEGEND(?hideStereotype)
 Colors can help to add additional information or simply to make the diagram more aesthetically pleasing.
 It can also help to save some space.
@ -80,6 +80,32 @@ Rel(web_app, twitter, "Gets tweets from", "HTTPS")
 ![LAYOUT_WITH_LEGEND Sample](https://www.plantuml.com/plantuml/png/PL1DJy905BplhrZnG4cm3SQJ9sebO0BOs2Bnr2pjKpRPh-o-sX3ZV_Sr89YubqdUp7ipizE0mcEh5L-cRy-Rije-bOjgEPlFre-y4DefO5VIrAfjWEyHNRXF4Y-w-4FYljsr0Nnj3OB1kBOw4OsNmdogrhL9TdUJAs5mirecIY04f56LaLf80pvsvChOVzjen5WEFbWJYKPBC-Q3j4SPq0kqVZ1YnI4WwEh1jgOH_X3Lap4V7jCEH_oBSNfdewY3NIMSepjRsF7KEILhWTAQ0Osowp5FYpnUpqfQyS1lumbVlMOzbofbky3xae6ZvTJG2PBeLg4aBrvs4X4yHwb1aLUWRD-dT14UIRfpaX79Na3zjhh4sWJQ95oKPLwGgXUTsSkPEI35wA27Ts_rtvKfc8R-ymS0 "LAYOUT_WITH_LEGEND Sample")
 Instead of a static legend (activated with `LAYOUT_WITH_LEGEND()`) a dynamic legend can be activated with `SHOW_DYNAMIC_LEGEND(?hideStereotype)`.
 The dynamic legend has following differences:
 * only relevant elements are listed
 * custom tags/stereotypes are supported
 * stereotypes can remain visible (with `SHOW_DYNAMIC_LEGEND(false)`)
 * **`SHOW_DYNAMIC_LEGEND()` has to be last call in the diagram**
 ```csharp
@startuml SHOW_DYNAMIC_LEGEND Sample
 !include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml
 Person(admin, "Administrator")
 System_Boundary(c1, 'Sample') {
    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")
 SHOW_DYNAMIC_LEGEND()
@enduml
 ```
 ![SHOW_DYNAMIC_LEGEND Sample](http://www.plantuml.com/plantuml/png/RL5Dgzf05DtFhxYrYnV1bs3fgYlJA5fG6vfOwIfCajiwC1_3p0r1IlzxRz1g5o-RIyx7uHnc5Ka66eo6QlVrtAn_7FF3bwBPRxQRunegQRn6yKxPJWyzmeN8nqzP5kIO_b9q6TeXOkYS9RIKTivaNaixnRr6whLgi-BZQpb1fyC-Cp8I1eQQWXrIMGofPwqG9OReR29xe-m2PlbqLQGWoONPN5HNDfhcinjiByCrwPOBUBbrUvd3Rm7yFIAJ4Tj6UiyvPsmXzrwhJf9oTiPGyNu1ULMcnqtDbe3m8Lt2uNinSRdMRemmJOf03dYFbomnWoRbDK8zAY8CGCgWLXOZT_jpRvVGZUISkun9yGtrlrNFMgV8JhwxkYuhLasY1_kCsI95_iNf_0pE_6yHRxnMCXShjFrWz5y0 "LAYOUT_WITH_LEGEND Sample")
 ## LAYOUT_AS_SKETCH()
--- a/README.md
+++ b/README.md
@ -102,6 +102,34 @@ Rel_R(api, db, "Reads/Writes")
 ![test](https://www.plantuml.com/plantuml/png/hL9DZzCm4BtdLtXxeIjjwmDmuRHLMzXA_Q8VL9ogQJnfZHmxUEnM_7l6QRORM90uS8erx-NDl9dtI05yYAN9xhJDJLGeJY5Kz45A3vV-KOTJF4H2dpiRq8P-xae9ockmPnEhA8VlUai3DcndKsaW80KkxOVC1ctHzwka_KP4op-MB2322KNXZ74NRO_2C4c0LU8NM7lYbnFSM1YNWp4_MECsuUi6sPt28acDnbycmyLy_GykGgpOo5jPfV5PfASPxHNCw57bDLkH9L10BnMU4qQtBXyNyyrWDrulPkF_sgYkmGN9bTXx_tAIPrSIx34QQ4o_Xh_16Vw6bVJTx7coC_x-UykDJBDJizFfuEjYkzdl9fkd_NJyQJmVTU-pRCa4Pxk9-20wmqY1X_KTVY_HLGRvWX24HLIYyax5F502Q-7EVNOxN9SguFfwEKXmOomzDvo0aYb2ymfz0NaZcPAHD-sk6B2skF3Esmhj5b1fHWRBIIAavQJl4yVD80bEbU1RCP68KtRK-OtLqXWTkkh0zH44E01XuinqxXsv8eZrvsajwOoYPxiFmdd58wPKQtjscWreMpXVGj3E9dxh5jmhMw5fzddToPQmtbaTBIOal4QkVlu0xrTNh_MeAmH5SbSdY-57j8hl-HC0 "test")
 Entities can be decorated with tags and explained via dynamic calculated legends, for example:
 ```cs
@startuml
 !include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml
 AddTagSupport("v1.0", $borderColor="#d73027")
 AddTagSupport("v1.1", $fontColor="#d73027")
 Person(user, "Customer", "People that need products")
 Person(admin, "Administrator", "People that administrates the products via the new v1.1 components", $tags="v1.1")
 Container(spa, "SPA", "angular", "The main interface that the customer interacts with via v1.0", $tags="v1.0")
 Container(spaAdmin, "Admin SPA", "angular", "The administrator interface that the customer interacts with via new v1.1", $tags="v1.1")
 Container(api, "API", "java", "Handles all business logic (incl. new v1.1 extensions)", $tags="v1.0+v1.1")
 ContainerDb(db, "Database", "Microsoft SQL", "Holds product, order and invoice information")
 Rel(user, spa, "Uses", "https")
 Rel(spa, api, "Uses", "https")
 Rel_R(api, db, "Reads/Writes")
 Rel(admin, spaAdmin, "Uses", "https")
 Rel(spaAdmin, api, "Uses", "https")
 SHOW_DYNAMIC_LEGEND()
@enduml
 ```
 ![tags](http://www.plantuml.com/plantuml/png/bLDHQnf147xtLsolVJYfyKnR21G25GrDG5Eh2Q5FCdSxwfQztMDdJllpEtiQjSbHoDF2p3VpVVFDx3lZ2bjhL1lcYhvcMO1TVsruK-SrOIYyOtJSBtoPLHOSrwMz8DRMvDdeoyKiXXwdawm4OWmIMewa0ep3qAy4s-aCjNw0zQAkAXyuJRQN_K7IKnzo7pI6aRS-N2VlzTNdmQUhfDk2lepebJHzXUtCC91tQTJPKyce9lOb1i4dC_ILHSKROEKGjQg2rtN196M7Aj2bSG8TnjSG1s3_gXPEIIG9uR6HsXfe0WvtAifKOb7bdPX5KJ73cguR_K9vz2Ib2eHYCHj69d3hsa93-Y2TIe4e8tw75HG70P6XE0ospq4atyc26WMDdUTqWvTqm_CvLJipd7lmHWb70_upDLGcAfZTHSBVi8NuteBJ5ac1jKfkJO14olgrALGQZx9_iXR_C3eotb7tts4_lgGQvwdEfVaO678WZ4HJKmHFViLgyNFIC7khwNcJFTLSeX8rCjtMcmBbNVbG0WjZlBCvsiEHxTVtI4YnJ_Db113pJKRcR4ylvtiF6crp14tPKp2CX_JpCHxNrSvnIhSJTHQtFvwMur_tm-dTQ3cv-NvpFqwxdM_eTFoAVm40 "tags")
 ## Supported Diagram Types
@ -168,10 +196,100 @@ In rare cases, you can force the layout using hidden relationships, `Lay_U`, `La
 C4-PlantUML also comes with some layout options to make it easy and reuseable to create nice and useful diagrams:
 * [LAYOUT_TOP_DOWN() or LAYOUT_LEFT_RIGHT()](LayoutOptions.md#layout_top_down-or-layout_left_right)
-* [LAYOUT_WITH_LEGEND()](LayoutOptions.md#layout_with_legend)
+* [LAYOUT_WITH_LEGEND() or SHOW_DYNAMIC_LEGEND(?hideStereotype)](LayoutOptions.md#layout_with_legend-or-show_dynamic_legend)
 * [LAYOUT_AS_SKETCH()](LayoutOptions.md#layout_as_sketch)
 * [HIDE_STEREOTYPE()](LayoutOptions.md#hide_stereotype)
 ## Custom tags/stereotypes support and skinparam updates
 Additional tags/stereotypes can be added to the existing element stereotypes (component, ...) and highlight,... specific aspects:
 * `AddTagSupport(tagStereo, ?bgColor, ?fontColor, ?borderColor, ?shadowing)`:
  After this call the given tag can be used in the diagram, the styles of the tagged elements are updated and the tag is be displayed in the dynamic legend.
 * `UpdateSkinparamsAndLegendEntry(tagStereo, ?bgColor, ?fontColor, ?borderColor, ?shadowing)`
  This call updates the style of the default element stereotypes (component, ...) and creates no additional legend entry.
 Each element can be extended with one or multiple custom tags/stereotypes via the keyword argument `$tags="..."`, like `Container(spaAdmin, "Admin SPA", $tags="v1.1")`.
 Multiple tags can be combined with `+`, like `Container(api, "API", $tags="v1.0+v1.1")`.
 **Comments**
 * `SHOW_DYNAMIC_LEGEND()` supports the customized stereotypes
      (`LAYOUT_WITH_LEGEND()` cannot be used, if the custom tags/stereotypes should be displayed in the legend).
 * `SHOW_DYNAMIC_LEGEND()` has to be last line in diagram.
 * Don't use space between `$tags` and `=` (PlantUML does not support it).
 * Don't use `,` as part of the tag names (PlantUML does not support it in combination with keyword arguments).
 * If 2 tags defines the same skinparameter, the first definition is used.
 * If specific skinparameters have to be merged (e.g. 2 tags change the font color) an additional combined tag has to be defined. Use `&` as part of combined tag names. This convention can be used in other tools.
 ```cs
@startuml
 !include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml
 AddTagSupport("v1.0", $fontColor="#d73027", $borderColor="#d73027")
 AddTagSupport("v1.1", $fontColor="#ffffbf", $borderColor="#ffffbf")
 AddTagSupport("v1.0&v1.1", $fontColor="#fdae61", $borderColor="#fdae61")
 AddTagSupport("fallback", $bgColor="#888888")
 Container(spa, "SPA", "angular", "The main interface that the customer interacts with via v1.0", $tags="v1.0")
 Container(spaAdmin, "Admin SPA", "angular", "The administrator interface that the customer interacts with via new v1.1", $tags="v1.1")
 Container(api, "API", "java", "Handles all business logic (incl. new v1.1 extensions)", $tags="v1.0&v1.1+v1.0+v1.1")
 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")
 Rel(spa, api, "Uses", "https")
 Rel(spaAdmin, api, "Uses", "https")
 Rel_L(spa, spa2, "Updates", "https")
 Rel_R(spaAdmin, spaAdmin2, "Updates", "https")
 SHOW_DYNAMIC_LEGEND(false)
@enduml
 ```
 ![merged tags](http://www.plantuml.com/plantuml/png/jLDXQzim5FpkNw5bOoIajHDlh6DGQ4ZBMaYxq3ICVGhFbkneaoMZzvpivq-Avj3KPh0FzHUPUwUxuvvzXGIMcaf5RwJELSC5snBL-2L9BEpZKjAsoHeKDZUQXAOuDrLIAz3-pZaILp9BvX_FbnvQto-I2f24TT1cxcw0rCB6jTUFPfm_GRbgwjfO6WvsqtWoE6Fl2aUR6sNivU0jl_WmIIyycXdBXNs1ZteqfYyr2lTaHLSZuBqQa_UzGXp4fsbNAE1TeGAKoY3_TRXHjkpFXyUnesCVGwpXZ0rMozd07Q3BHe7rhqzRmIf7OLAJi0NaWj4MY973ymR9LCA66UI4RE-MmtOIM5ibGOcNeTZHgTsCLr8xXyF9-ft1poII1JBsVoDeiMTjYSSOqvCOK4kVO7dd3N_23lnv2vehWGoKObc3ZeZ8b2bbpeR-WuoFoapy9g5H6esZ4vUmlR5_6tTCiOOqT9s-MjdZTlEzhQVFQqzVl_SsJDj5z2XK-EB20jOeq5iVVdCt3-EGzH-SpIA8_2rqNNEWBkdncTInW7vwjBhzzdrp_UDXTdyttonkljuyN0zTU1IZw4fetbJg3m00 "merged tags")
 **Custom schema definition**
 If the custom (color) schema is defined via `UpdateSkinparamsAndLegendEntry()` then the legend of existing elements is updated too.
 ```cs
@startuml
 !include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Context.puml
 !$COLOR_A_5 = "#7f3b08"
 !$COLOR_A_4 = "#b35806"
 !$COLOR_A_3 = "#e08214"
 !$COLOR_A_2 = "#fdb863"
 !$COLOR_A_1 = "#fee0b6b"
 !$COLOR_NEUTRAL = "#f7f7f7"
 !$COLOR_B_1 = "#d8daeb"
 !$COLOR_B_2 = "#b2abd2"
 !$COLOR_B_3 = "#8073ac"
 !$COLOR_B_4 = "#542788"
 !$COLOR_B_5 = "#2d004b"
 UpdateSkinparamsAndLegendEntry("person", $bgColor=$COLOR_A_5, $fontColor=$COLOR_NEUTRAL, $borderColor=$COLOR_A_1, $shadowing="true")
 UpdateSkinparamsAndLegendEntry("external_person", $bgColor=$COLOR_B_5, $fontColor=$COLOR_NEUTRAL, $borderColor=$COLOR_B_1)
 UpdateSkinparamsAndLegendEntry("system", $bgColor=$COLOR_A_4, $fontColor=$COLOR_NEUTRAL, $borderColor=$COLOR_A_2)
 UpdateSkinparamsAndLegendEntry("external_system", $bgColor=$COLOR_B_4, $fontColor=$COLOR_NEUTRAL, $borderColor=$COLOR_B_2)
 Person(customer, "Personal Banking Customer")
 System(banking_system, "Internet Banking System")
 System_Ext(mail_system, "E-mail system")
 System_Ext(mainframe, "Mainframe Banking System")
 Rel(customer, banking_system, "Uses")
 Rel_Back(customer, mail_system, "Sends e-mails to")
 Rel_Neighbor(banking_system, mail_system, "Sends e-mails")
 Rel(banking_system, mainframe, "Uses")
 SHOW_DYNAMIC_LEGEND()
@enduml
 ```
 ![custom schema](http://www.plantuml.com/plantuml/png/dPHVRvim5CNV-HIKzI6LceGGag19aHeesYhbJvKiclQ4R7n3KC4WswZfjvy1RtXfkwfHNiBldkDxZf6uum8nKUMPSPNIEAi8c4SXIlvrE6JeUP2aubZXYWEB2og0Ya5SvCCoGxJszBaWMOg7WTj_hD5-jHpcY0jW4aL1xJY9GLcVRbnT1vlbPXijeeavDwqliyCOsvwbSRVXU3pnxAdEnmq7stD6hiwTXXy8zgPZdOzQ3c3ZAUu6wt3_OxjOjiDP_UjclZ8HZo306bTBi8CmSJIkGddsR8nYZQiI4zUPUPx6LMc7sBOhppVs9K42TayfBH53ELzGieG4A0cfO2yzgmJ62shTcjSu2OgiOFFk-YGy55Hqk2jNwmj6W9rvHdB0ZuWKpobDvfPW5LWt7uQ0am16KHQzcyQ_88sywuzNynSk87-pltj1V-SJPTzTxL-msgzN6u_D_VNYYeiY1tPhMYr1cUaZAYCbPg1cyhNicW0zt4vK7kbve7L247yzhL0wb2KAJwANepJhF66_VZQvKfu9wO6X7AHizUV_6sTl8TEIlqgrvy2bJAeY7yLFclJV93kWX9lGvE6cA9Hd3Mbon0Kxg_jVTsjzxT0AgLJ6xllcPtJ_QxrOFGJHClmMhkzxDyOTK59_b7u3 "custom schema")
 ## Snippets for Visual Studio Code
 Because the PlantUML support inside of Visual Studio Code is excellent with the [PlantUML extension](https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml), you can also find VS Code snippets for C4-PlantUML at [.vscode/C4.code-snippets](.vscode/C4.code-snippets).
--- a/samples/C4CoreDiagrams.md
+++ b/samples/C4CoreDiagrams.md
@ -44,7 +44,7 @@ Source: [C4_Dynamic Diagram Sample - bigbankplc.puml](C4_Dynamic%20Diagram%20Sam
 Source: [C4_Deployment Diagram Sample - bigbankplc.puml](C4_Deployment%20Diagram%20Sample%20-%20bigbankplc.puml)
-![Deployment Diagram for Internet Banking System - Live](http://www.plantuml.com/plantuml/png/rLNVJoD737xFN-7cXHy2SaIeElNfGa8FA87eDfHMgXHvPvpDz6PdLZEpWRIw_xssDX0MKkcuUxeyH3jUVxQ_psFlXvWmfBgqdP-CKxRM18kKglXBhnVm_gWmQL7dTQIWl4laqf7oPQ-ow0Hp69Es9kyDJmudOheTN_LAZ8a2csOZggnVbGAg9C4Er8xHOe2q89XxQ_szSGLOumZGQMYzDY7oamVE3jOhj7R5CPxAt9AXitCr-FFcTZeRPBFijxFfy7nthxCstLrCpsTNPn_FhaTix2IJBC4c08mC5W5BhYh01LCDZXASelii1MOh9bN28LoP9NKw6zZisclQhQmwWEwfAK00mCVkYpDeJ0YA971txzyEyEzb5EqOb9iYPymXLcP_V_-lzF1UGjtcDGiEnpyVlJk1gsds669R6AnGBOX10taWcFfIOUg-DC3xeuTDcEOtz2wXSHGuY170v086LMKD-nll9CObBX6aLLaLH9dnxqCnJu9V6atnjNHpRhg0qPgqWgLXD5ncDzUzy-bqaW6dEEhkFLNnfTFyRoEsbaRdxuwV2IN7jqha0oeh4jt80y4XJ88fCQow6zjnN_slFADyL-ViEiA4EKOIs2UosF24HpDaB7U9yZPBFb046IG8L9YO0eet63VtePHdxlu2uu8qO9qMNEjQTL21j1pHnWD0fIX6iBxW0oNrTl7wRV7wtoPU_xbw6Idlz1lrw_zW0kRFXRkdl1dFasyRp_vtpYVdPy0TvLyvdoEoPaaXWcpMcDXTmNgZYxUONuzkv3zBK651W9iqsnJxydefbbvA7DOn-PB2JWGs60wdQMaKDNmhosblCl011au7RxHGRbDjOEm-Rl2C4l0VM28pR2qV16jAaqX3hFD82VnyExFsKaeUrBhCA1jAC2QqwsNIsqWgNrPjbcAfPSjBnIOe7_qymPrnsjz7AQXXNQAwaNko_Qu5zgMmxl2fd9g07xsNZWmNmPSioTZ_Own5-DK4clk7WtNi3ESOZ8WwDYeq1PpfWXxJjVMD5SfyDRsUO47RhbIcWgcQgp9mHMqnj8MtzlkqvliCQzQizEPIyL9ukW3DDscCdpcXV9aKPuqSK2hvEthNV54OBI1czJR4xBOPAWQsviM3i5AR1ZyhTPrBqe3EPOSHwWZpu4kH2kw3IVIOy79qEcm3-b-Dc7tYXRc1DErXFuq9sPcTEX_8wRgq_m40 "Deployment Diagram for Internet Banking System - Live")
+![Deployment Diagram for Internet Banking System - Live](http://www.plantuml.com/plantuml/png/pLPXJoCt4FsUNp5DAnqW812XwbJff0i9FK24H6meFQbID6jFDYvUUsLx0sbr_xtZtN1X8UYWz-L0Yko9tyoyDpDsFlg0BfIvRlsaZD2b99Y7KFZVEXs7T_kP2lCoBJqvOKqW4_Q5pJk5HXCnUpv8hT9E_sXl74tNmujEZZwGOzDqG8Msopo2YXZW7PI6qT40OKumirhREsKoqCeGe97G-5evpoiB71sq5QZradryJND3X5PFoWbcILaKreMjzemnAOhRzYxyacPzgwtxqFvP7CJ_zdQBlScbmLm9q9GHnrS-HfEmXIAe1GPUAWEQALKvRZFYelTvT3sPtfnDJgSN9vzEBWTRx2cee0dM-S10OUOmPv8EpbWvPoZ0CPhRo3TPiaOvxC65Mb2hjOPDBwsahKABNMWVgwm206_RJ_OWCI08YexRs_-sWF-UUf66GQdAKiRiOQ5sTdR-2lVlewlhjEJwmU6l-mT7S3597bniSeC5YZang5SjO69pWQ7zr03lz-_NRkg_lZK1MJR7JbG4ZC-WLnHQyNbbJVHnZWkiAfyKBYep_ACVpMDd5qgIVoxTZ7ieWb6hi8I5OZIS9wFBpkbaCaw0G-npPHyo-DAgFZVgiv96fWU7ZuIAsxTAP1qA7IKQLGkkwzYf7DsolROTTiMByWpIBPdoqG46JD5JX5sHnfedF9WXORbpZDycmJggUjM1eqpvuAhJe0mtN5wjTs6EVauIi0nppdMbEWX7CcvH-rr08SXxq3RZ3GNnTl6wJV6w6yNZ-GkO-G_hYTo6R-dPVIneGi8Q-LpIpOvVLhdxeyZyBF7N2fy-5loEqdgiZ_xVM7U_SwuvFWDkA7tbN0z8gmKvNrtmFl1n0Qk79PwEvkSZx_b34nIO4U0wpAPM_VByCirjJB5V-c1pSkyyi46nEqaB9QZcMsWEEqh0EkWPwQoIaNAJQWtZuyCQpwW8_XDpP8QDImj1grp5nyENgMScTXQPVUio2nR4AaqVRxQ8KQwPBvFUH5BOl6YoZ9OolWunO-M4zNOMu4OPQUzyJAXcdQCO9I-z8AdZi-HM5JwEkzhX9sjZHVfpPtEMP6Z_KLeZ_AuSpUpzxiftWZEM9eewLCBL2Pp8Z1x2DVNr1SQ9gsizvbflQgb4E5NKhT8pMQdHDONN-lkqvdw65MjMUjrKLwI_Da3zbWtnbWF65qrmLCyEOoP_UslgbuZH38giteQONjT3nS36lDYAbLWN-56ggrXL69bMjnfA3pEkJYNLdLE17WAU3uxxJK3trOZf5L-XQqXT7lBrhv5W-L0hEHtTJ0UVBtl3i_xwzz57ChBCzNy0 "Deployment Diagram for Internet Banking System - Live")
 ## Icons
--- a/samples/C4_Deployment
+++ b/samples/C4_Deployment
@ -3,8 +3,10 @@
 ' uncomment the following line and comment the first to use locally
 ' !include C4_Deployment.puml
-'LAYOUT_AS_SKETCH()
+AddTagSupport("fallback", $bgColor="#c0c0c0")
-LAYOUT_WITH_LEGEND()
+
 ' dynamic legend is used (activated in last line)
 ' LAYOUT_WITH_LEGEND()
 title Deployment Diagram for Internet Banking System - Live
@ -19,9 +21,9 @@ Deployment_Node(plc, "Big Bank plc", "Big Bank plc data center"){
            ContainerDb(db, "Database", "Relational Database Schema", "Stores user registration information, hashed authentication credentials, access logs, etc.")
        }
    }
-    Deployment_Node(bigbankdb02, "bigbank-db02", "Ubuntu 16.04 LTS"){
+    Deployment_Node(bigbankdb02, "bigbank-db02", "Ubuntu 16.04 LTS", $tags="fallback") {
-        Deployment_Node(oracle2, "Oracle - Secondary", "Oracle 12c"){
+        Deployment_Node(oracle2, "Oracle - Secondary", "Oracle 12c", $tags="fallback") {
-            ContainerDb(db2, "Database", "Relational Database Schema", "Stores user registration information, hashed authentication credentials, access logs, etc.")
+            ContainerDb(db2, "Database", "Relational Database Schema", "Stores user registration information, hashed authentication credentials, access logs, etc.", $tags="fallback")
        }
    }
    Deployment_Node(bb2, "bigbank-web***\tx4", "Ubuntu 16.04 LTS"){
@ -48,4 +50,5 @@ 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")
 SHOW_DYNAMIC_LEGEND()
@enduml