Flowchart truncated

[tylerlong]

 graph LR
 A-->B
 B-->C
 C-->A
 D-->C

Tested in both here and here.

This issue was originally reported here: markpluslabs/react-markplus#3

[knsv]

Thanks for reporting this. I can reproduce the problem and will include a fix in next release.

[logankoester]

I think I'm encountering the same issue, but it is truncating a bit differently.

Input

graph LR;
    request[Request] --> haproxy;
    haproxy[HAProxy] --> container;
    container[Service Container];

Output

<div class="mermaid" data-processed="true"><svg id="mermaidChart0" width="444" xmlns="http://www.w3.org/2000/svg" height="85" viewBox="0 0 444 85"><style type="text/css" title="mermaid-svg-internal-css">/* <![CDATA[ */
.node { fill:#eaeaea; stroke:#666; stroke-width:1.5px; }
.book .book-body .page-wrapper .page-inner section.normal * { box-sizing: border-box; }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: antialiased; }
/* ]]> */
</style><g><g class="output"><g class="clusters"></g><g class="edgePaths"><g class="edgePath" style="opacity: 1;"><path class="path" d="M98,42.5L123,42.5L148,42.5" marker-end="url(#arrowhead12)" style="stroke: #333; stroke-width: 1.5px;fill:none"></path><defs><marker id="arrowhead12" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" style="fill: #333"></path></marker></defs></g><g class="edgePath" style="opacity: 1;"><path class="path" d="M229,42.5L254,42.5L279,42.5" marker-end="url(#arrowhead13)" style="stroke: #333; stroke-width: 1.5px;fill:none"></path><defs><marker id="arrowhead13" viewBox="0 0 10 10" refX="9" refY="5" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 10 5 L 0 10 z" style="fill: #333"></path></marker></defs></g></g><g class="edgeLabels"><g class="edgeLabel" style="opacity: 1;" transform=""><g transform="translate(0,0)" class="label"><foreignObject width="0" height="0"><div style="display: inline-block; white-space: nowrap;"><span style="background:#e8e8e8"></span></div></foreignObject></g></g><g class="edgeLabel" style="opacity: 1;" transform=""><g transform="translate(0,0)" class="label"><foreignObject width="0" height="0"><div style="display: inline-block; white-space: nowrap;"><span style="background:#e8e8e8"></span></div></foreignObject></g></g></g><g class="nodes"><g class="node" style="opacity: 1;" id="request" transform="translate(59,42.5)"><rect rx="0" ry="0" x="-39" y="-22.5" width="78" height="45"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-29,-12.5)"><foreignObject width="58" height="25"><div style="display: inline-block; white-space: nowrap;">Request</div></foreignObject></g></g></g><g class="node" style="opacity: 1;" id="haproxy" transform="translate(188.5,42.5)"><rect rx="0" ry="0" x="-40.5" y="-22.5" width="81" height="45"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-30.5,-12.5)"><foreignObject width="61" height="25"><div style="display: inline-block; white-space: nowrap;">HAProxy</div></foreignObject></g></g></g><g class="node" style="opacity: 1;" id="container" transform="translate(351.5,42.5)"><rect rx="0" ry="0" x="-72.5" y="-22.5" width="145" height="45"></rect><g class="label" transform="translate(0,0)"><g transform="translate(-62.5,-12.5)"><foreignObject width="125" height="25"><div style="display: inline-block; white-space: nowrap;overflow-wrap: break-word;">Service Container</div></foreignObject></g></g></g></g></g></g></svg></div>

Render

[logankoester]

I'm not sure if it is relevant, but I am using mermaid via gitbook-plugin-mermaid and the default gitbook stylesheet.

If I should open this issue on the gitbook-plugin-mermaid project instead, please let me know.

[knsv]

Hi @logankoester I missed your question. I am sorry about this. I think your issue indeed is astyling issue for the gitbook-plugin-mermaid. Let me know if you think I can close this issue here.

[knsv]

Will close this one now. Let me know if you still are have problems with this.