doc/readme_example_4.svg

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="538px" height="341px" viewBox="-0.5 -0.5 538 341" content="&lt;mxfile host=&quot;Chrome&quot; modified=&quot;2019-11-13T17:00:52.289Z&quot; agent=&quot;Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.97 Safari/537.36&quot; version=&quot;12.2.2&quot; etag=&quot;E22ye65Hmga4N1S7OZ7A&quot; type=&quot;device&quot; pages=&quot;1&quot;&gt;&lt;diagram id=&quot;8p4PXt6CKBag_dtJR70u&quot; name=&quot;Page-1&quot;&gt;1VlLc5swEP41PsaDJOTgY+JHe0hnMs10muQmgwwkMmKE/OqvLzKSeQXHrxYy44N2tSuh3f0+raGHRovNN0Hi4Af3KOtBy9v00LgH4RDCnvpZ3jZTDICVKXwRepkK5Iqn8A/VSmO2DD2alAwl50yGcVnp8iiirizpiBB8XTabc1beNSY+rSmeXMLq2t+hJ4NM62Ar13+noR+YnYGlZxbEGGtFEhCPrwsqNOmhkeBcZqPFZkSZip2JS+Y3bZjdP5igkTzG4ddk83MwfR+/TKev68B6fbZuHm+ATk8it+bE1EsDoEUuZMB9HhE2ybX37lKsqFoVpILgy8jbSVYq5Q4PnMfa5I1KudWpJUvJU1UgF0zP0k0on7W7Gr+ocR9rabwpTI23Roik2O6c+rfYyC9mQSXkfjvJOGanVUdsjKJWJXwpXHoodLoaifCpPGAH97lOMUL5gqbPk/oJyogMV+XnILpa/b1dntB0oHN6Sn7t7uS3D3EhxeC8BFvdSzBuNcHZuivClnonPntTRAiteuoLWZmHjI0442I3g+aOS1031SdS8HdamJk52MZ5ZFdUSLo5HNt6LLSD7Wgu1JcBRFpe59QKDPMHBVo1dtcPH+oMPsAJ/HfFKodHVnlDZv9PlcOL03QRcZ3BW6BEWn38CW1lsDMdBmgnxajVFDcTWb1HaZvIEC4TGbDbJjKnMzx2Zh/XVhuHjgSH3eotP+hOes9hQ9P7tdDFHZvfVrs41Ex+9ZuvbfKDdte6uGFH0WGdRX6fgcMjSbB/8nMr4CrYso/E1qV/gXeud0KQbcEg5mEkk8LKj0qRlylwcKlMh5XXIxVz2zpkng6y/fMi3R/k/Lq1m2EPaiXdDHsPU8ezP0q6A2doMLgO7AGq9Dy4bdjj5vDhzrFmtWVEsO3wgQ71jPotz5fpKsDtl2gbb2sIuYvjnnpbvoh5pE5drYAkILEa5hbonrDQj1Ido3MlJjFxw8h/2EljdCV6wajMLh+gw/4AHYN/ho5hLXZ1uETenfrGoNAS02hXcN40ZPvyjswXDQDLhX86g5eAV35dAE+o7Xr8ixE20TztZq5fvZUO0akkKYOXdjpwJ1fX2ctmoQx+tYVObhVgZR9w0eWfivlnncw8/zaGJn8B&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(255, 255, 255);"><defs/><g><path d="M 427 235 Q 380 235 380 166.37" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 380 161.12 L 383.5 168.12 L 380 166.37 L 376.5 168.12 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 455 250 Q 455 280 417.5 280 Q 380 280 380 303.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 380 308.88 L 376.5 301.88 L 380 303.63 L 383.5 301.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><rect x="427" y="220" width="110" height="30" fill="#f8cecc" stroke="#b85450" pointer-events="none"/><g transform="translate(460.5,228.5)"><switch><foreignObject style="overflow:visible;" pointer-events="none" width="42" height="12" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; white-space: nowrap; text-align: center;"><div xmlns="http://www.w3.org/1999/xhtml" style="display:inline-block;text-align:inherit;text-decoration:inherit;">object 4</div></div></foreignObject><text x="21" y="12" fill="#000000" text-anchor="middle" font-size="12px" font-family="Helvetica">object 4</text></switch></g><path d="M 407 145 Q 482 145 482 213.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 482 218.88 L 478.5 211.88 L 482 213.63 L 485.5 211.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 352 160 Q 352 235 303.37 235" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 298.12 235 L 305.12 231.5 L 303.37 235 L 305.12 238.5 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><rect x="297" y="130" width="110" height="30" fill="#f8cecc" stroke="#b85450" pointer-events="none"/><g transform="translate(330.5,138.5)"><switch><foreignObject style="overflow:visible;" pointer-events="none" width="42" height="12" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; white-space: nowrap; text-align: center;"><div xmlns="http://www.w3.org/1999/xhtml" style="display:inline-block;text-align:inherit;text-decoration:inherit;">object 2</div></div></foreignObject><text x="21" y="12" fill="#000000" text-anchor="middle" font-size="12px" font-family="Helvetica">object 2</text></switch></g><path d="M 187 235 Q 132 235 132 176.37" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 132 171.12 L 135.5 178.12 L 132 176.37 L 128.5 178.12 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 242 250 Q 242 280 283.5 280 Q 325 280 325 303.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 325 308.88 L 321.5 301.88 L 325 303.63 L 328.5 301.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><rect x="187" y="220" width="110" height="30" fill="#f8cecc" stroke="#b85450" pointer-events="none"/><g transform="translate(220.5,228.5)"><switch><foreignObject style="overflow:visible;" pointer-events="none" width="42" height="12" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; white-space: nowrap; text-align: center;"><div xmlns="http://www.w3.org/1999/xhtml" style="display:inline-block;text-align:inherit;text-decoration:inherit;">object 3</div></div></foreignObject><text x="21" y="12" fill="#000000" text-anchor="middle" font-size="12px" font-family="Helvetica">object 3</text></switch></g><path d="M 132 140 Q 132 80 242 80 Q 352 80 352 123.63" fill="none" stroke="#b85450" stroke-miterlimit="10" stroke-dasharray="3 3" pointer-events="none"/><path d="M 352 128.88 L 348.5 121.88 L 352 123.63 L 355.5 121.88 Z" fill="#b85450" stroke="#b85450" stroke-miterlimit="10" pointer-events="none"/><rect x="77" y="140" width="110" height="30" fill="#d5e8d4" stroke="#82b366" pointer-events="none"/><g transform="translate(110.5,148.5)"><switch><foreignObject style="overflow:visible;" pointer-events="none" width="42" height="12" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; white-space: nowrap; text-align: center;"><div xmlns="http://www.w3.org/1999/xhtml" style="display:inline-block;text-align:inherit;text-decoration:inherit;">object 1</div></div></foreignObject><text x="21" y="12" fill="#000000" text-anchor="middle" font-size="12px" font-family="Helvetica">object 1</text></switch></g><rect x="297" y="310" width="110" height="30" fill="#f8cecc" stroke="#b85450" pointer-events="none"/><g transform="translate(330.5,318.5)"><switch><foreignObject style="overflow:visible;" pointer-events="none" width="42" height="12" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; white-space: nowrap; text-align: center;"><div xmlns="http://www.w3.org/1999/xhtml" style="display:inline-block;text-align:inherit;text-decoration:inherit;">object 5</div></div></foreignObject><text x="21" y="12" fill="#000000" text-anchor="middle" font-size="12px" font-family="Helvetica">object 5</text></switch></g><path d="M 105 60 Q 105 60 105 133.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 105 138.88 L 101.5 131.88 L 105 133.63 L 108.5 131.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 16 0 L 140 0 L 140 60 L 16 60 L 16 48 L 0 48 L 0 36 L 16 36 L 16 24 L 0 24 L 0 12 L 16 12 Z" fill="#ffffff" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><path d="M 16 12 L 32 12 L 32 24 L 16 24 M 16 36 L 32 36 L 32 48 L 16 48" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="none"/><g fill="#000000" font-family="Helvetica" font-size="12px"><text x="38.5" y="33.5">App component</text></g><path d="M 87 70 Q 67 100 84.52 126.28" fill="none" stroke="#82b366" stroke-width="2" stroke-miterlimit="10" pointer-events="none"/><path d="M 72.17 120.37 L 85.76 128.14 L 83.82 112.61" fill="none" stroke="#82b366" stroke-width="2" stroke-miterlimit="10" pointer-events="none"/></g></svg>