Skip to content

Instantly share code, notes, and snippets.

@jocile
Last active June 16, 2022 22:34
Show Gist options
  • Save jocile/b98add89c82e8629eb11b409c5dd0e69 to your computer and use it in GitHub Desktop.
Save jocile/b98add89c82e8629eb11b409c5dd0e69 to your computer and use it in GitHub Desktop.
Diagrams.net models
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="531px" height="541px" viewBox="-0.5 -0.5 531 541" content="&lt;mxfile&gt;&lt;diagram id=&quot;LtN_3EFEarP_-d4oAv1Z&quot; name=&quot;Página-1&quot;&gt;7VvJcts4EP0aHZPiLumoJZ6kKjPlGqdqZo4QAYtISIIBIVnK109TBCiuthYucuyTiSbWft39mmh5ZC6C3R8cRd6fDBN/ZGh4NzKXI8PQNUuDP4lkn0osa5IK1pxi2ekoeKC/iBoppRuKSVzoKBjzBY2KQpeFIXFFQYY4Z0/Fbo/ML64aoTWpCB5c5Fel/1AsvFQ61bSj/DOha0+u7KgXAVJ9pSD2EGZPOZH5aWQuOGMifQp2C+InulNqScfdNbzN9sVJKE4ZkO1D7NXZCIajymbIQvgz90TgQ0uHR5iX7/+FhqYa/yWNj7ZqLnf5l8t9vnVPOA2IIDwT4lmCxnElkNxR35fv070lG2o8nhTFbMNd2cuQBoH4mqhe00y3YJOEwSb4Hvpw4iNBt8XpkTSOddZPDoW9on2uQ8RoKOLczPeJADpIOzeUmUsrH5eweKG7bpj5/vCQbkC1cic5ig74NmCdzr5F/kYeeLQwRrP5ggURaB+2As05KN3xQW3zFYentTjAICVKMIsiJYNFV8d+JVPK2Q3mLPqmEEmw3RIuKHjUzKfrEGQBxTgZJ2dJXpPd87BX8ZQDSopUzaejq+qOlHkFN202gBwKzyrZrCq5rBXw+Sh5DBjeHE78nQixV3FkogRZALFOVYrxrFL0ihKMGh0o2XmeUbHlD8a4aPrFCdjjYwyWUNbrefbstGbPf6HtHPGrTboNyzVfNl2rI9MdD2i6ztsyXd3ujXa7YFjdqlJsA4Ing3GqlerO2arrSwUN8bd9FVg1nuqgIILTHCIYDdaZQIYxDccfMOI/PsbbdaNbR5xtIbHGf5OfG8oJ/hJCrvaI3JJGFXV/RSvi37OYCsoSChcsWTD+QYTrSeVimMaVr59InOzFL41ySXjICOdIZgKZoJwirJgQLGgn0JpGMdA61UD7XIy5Cr7pC/B5egW9B/j0gExTW6LYWzHE8UAYEnTAsBEZj3H6i4UCqXVOR7sDUHXd7A1VS69A8uq/pMxJNchZWj0ErUc5tXgL+R0kdwsPcXGLGV52p9FHimfWhZ6+crwU0LeT5FnmpRFBPzcidOH8ygbbzHBauUZR7VPvUYrXLldfo6jZcz60Sj4eNTcNMe+5VZmGDbO/5MqyXiENF9zOruHc8ckQtE7Daj8t0PAdY4mqbpCEbaNHErZqLq56I+EUzjdEwpMbIWHONiGEfznxhZQ8vlFKtu3zKFn50VAUXr3qdIGSaXJkDbwnPfo7jZdArrmM7ozGp6+cxu2a7Nk2hqNxu5q1XkrjSyTQN7QCIG6Qyc1xj0xu6wMyud1wEfO7Mrl9/ud094xst0K/Vf7TavkvmyGNKnLQUavX0rilDUrLKj7m3AlDrDlE0UO4eefkMieb0/442b64aHkT91l2BxW7VrxOnwzrdS9VEz27Uo6aHWaQRalBvPKVFaJqspLO3HR8qZveSupcU3VS2dogqXN7haglCzfidktRNWTSXe48ZCnKfmOlKOek4nQxIe78JzTOtZXkm8qdVcgfiMWVS+Zz5yTYjN7rUs3Jc03pvSVWhubxR/wpnMf/hDA//Q8=&lt;/diagram&gt;&lt;/mxfile&gt;">
<defs/>
<g>
<path d="M 160 30 L 190 30 Q 200 30 200 40 L 200 73 Q 200 83 210 83 L 280 83" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<rect x="0" y="0" width="160" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 30px; margin-left: 80px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
«Component»
<br/>
<b>
App
</b>
</div>
</div>
</div>
</foreignObject>
<text x="80" y="34" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
«Component»...
</text>
</switch>
</g>
<path d="M 137 7 L 153 7 L 153 27 L 137 27 L 137 23 L 133 23 L 133 19 L 137 19 L 137 15 L 133 15 L 133 11 L 137 11 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 137 11 L 141 11 L 141 15 L 137 15 M 137 19 L 141 19 L 141 23 L 137 23" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="390" y="0" width="140" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 30px; margin-left: 460px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
«Component»
<br/>
<b>
NavBar
</b>
</div>
</div>
</div>
</foreignObject>
<text x="460" y="34" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
«Component»...
</text>
</switch>
</g>
<path d="M 507 7 L 523 7 L 523 27 L 507 27 L 507 23 L 503 23 L 503 19 L 507 19 L 507 15 L 503 15 L 503 11 L 507 11 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 507 11 L 511 11 L 511 15 L 507 15 M 507 19 L 511 19 L 511 23 L 507 23" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 300 30 L 390 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 280 30 L 160 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<ellipse cx="287" cy="30" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" transform="rotate(180,290,30)" pointer-events="all"/>
<path d="M 290 20 Q 300 20 300 30 Q 300 40 290 40" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" transform="rotate(180,290,30)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 17px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
&lt;img&gt; ds-dark.svg
</div>
</div>
</div>
</foreignObject>
<text x="290" y="17" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
&lt;im...
</text>
</switch>
</g>
<ellipse cx="287" cy="83" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<path d="M 290 73 Q 300 73 300 83 Q 300 93 290 93" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 70px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
&lt;h1&gt; Sales Dashboard
</div>
</div>
</div>
</foreignObject>
<text x="290" y="70" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
&lt;h1...
</text>
</switch>
</g>
<path d="M 390 200 L 300 200" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<rect x="390" y="170" width="140" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 200px; margin-left: 460px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
«Component»
<br/>
<b>
BarChart
</b>
</div>
</div>
</div>
</foreignObject>
<text x="460" y="204" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
«Component»...
</text>
</switch>
</g>
<path d="M 507 177 L 523 177 L 523 197 L 507 197 L 507 193 L 503 193 L 503 189 L 507 189 L 507 185 L 503 185 L 503 181 L 507 181 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 507 181 L 511 181 L 511 185 L 507 185 M 507 189 L 511 189 L 511 193 L 507 193" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 280 200 L 210 200 Q 200 200 200 190 L 200 40 Q 200 30 190 30 L 160 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<ellipse cx="287" cy="200" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" transform="rotate(180,290,200)" pointer-events="all"/>
<path d="M 290 190 Q 300 190 300 200 Q 300 210 290 210" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" transform="rotate(180,290,200)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 187px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
bar chart
</div>
</div>
</div>
</foreignObject>
<text x="290" y="187" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
bar...
</text>
</switch>
</g>
<path d="M 390 510 L 300 510" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<rect x="390" y="480" width="140" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 510px; margin-left: 460px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
«Component»
<br/>
<b>
Footer
</b>
</div>
</div>
</div>
</foreignObject>
<text x="460" y="514" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
«Component»...
</text>
</switch>
</g>
<path d="M 507 487 L 523 487 L 523 507 L 507 507 L 507 503 L 503 503 L 503 499 L 507 499 L 507 495 L 503 495 L 503 491 L 507 491 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 507 491 L 511 491 L 511 495 L 507 495 M 507 499 L 511 499 L 511 503 L 507 503" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 280 510 L 210 510 Q 200 510 200 500 L 200 230 Q 200 220 200 210 L 200 40 Q 200 30 190 30 L 160 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<ellipse cx="287" cy="510" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" transform="rotate(180,290,510)" pointer-events="all"/>
<path d="M 290 500 Q 300 500 300 510 Q 300 520 290 520" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" transform="rotate(180,290,510)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 497px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
credits texts
</div>
</div>
</div>
</foreignObject>
<text x="290" y="497" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
cre...
</text>
</switch>
</g>
<path d="M 390 360 L 300 360" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<rect x="390" y="330" width="140" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 360px; margin-left: 460px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
«Component»
<br/>
<b>
DataTable
</b>
</div>
</div>
</div>
</foreignObject>
<text x="460" y="364" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
«Component»...
</text>
</switch>
</g>
<path d="M 507 337 L 523 337 L 523 357 L 507 357 L 507 353 L 503 353 L 503 349 L 507 349 L 507 345 L 503 345 L 503 341 L 507 341 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 507 341 L 511 341 L 511 345 L 507 345 M 507 349 L 511 349 L 511 353 L 507 353" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 280 360 L 210 360 Q 200 360 200 350 L 200 40 Q 200 30 190 30 L 160 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<ellipse cx="287" cy="360" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" transform="rotate(180,290,360)" pointer-events="all"/>
<path d="M 290 350 Q 300 350 300 360 Q 300 370 290 370" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" transform="rotate(180,290,360)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 347px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
data table
</div>
</div>
</div>
</foreignObject>
<text x="290" y="347" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
dat...
</text>
</switch>
</g>
<path d="M 280 140 L 210 140 Q 200 140 200 130 L 200 40 Q 200 30 190 30 L 160 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<ellipse cx="287" cy="140" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<path d="M 290 130 Q 300 130 300 140 Q 300 150 290 150" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 127px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
&lt;h5&gt; All Sales
</div>
</div>
</div>
</foreignObject>
<text x="290" y="127" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
&lt;h5...
</text>
</switch>
</g>
<path d="M 390 280 L 300 280" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<rect x="390" y="250" width="140" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 280px; margin-left: 460px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
«Component»
<br/>
<b>
DonutChart
</b>
</div>
</div>
</div>
</foreignObject>
<text x="460" y="284" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
«Component»...
</text>
</switch>
</g>
<path d="M 507 257 L 523 257 L 523 277 L 507 277 L 507 273 L 503 273 L 503 269 L 507 269 L 507 265 L 503 265 L 503 261 L 507 261 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 507 261 L 511 261 L 511 265 L 507 265 M 507 269 L 511 269 L 511 273 L 507 273" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 280 280 L 210 280 Q 200 280 200 270 L 200 40 Q 200 30 190 30 L 160 30" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<ellipse cx="287" cy="280" rx="7" ry="7" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" transform="rotate(180,290,280)" pointer-events="all"/>
<path d="M 290 270 Q 300 270 300 280 Q 300 290 290 290" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" transform="rotate(180,290,280)" pointer-events="all"/>
<g transform="translate(-0.5 -0.5)">
<switch>
<foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 267px; margin-left: 290px;">
<div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">
donut chart
</div>
</div>
</div>
</foreignObject>
<text x="290" y="267" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
don...
</text>
</switch>
</g>
</g>
<switch>
<g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/>
<a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank">
<text text-anchor="middle" font-size="10px" x="50%" y="100%">
Viewer does not support full SVG 1.1
</text>
</a>
</switch>
</svg>
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment