mmdr Rendering Issues

Remaining differences between mmdr and official mermaid-cli output
22 diagram types • 77 comparison examples • Last updated: 2026-02-07

Recently Fixed

Fixed Sequence diagrams — Participant alias parsing was swapped, causing duplicate lifelines in 5 of 8 sequence diagrams
Fixed Architecture diagrams — Service icons showed "?" placeholders instead of globe/server/database/cloud icons; edge port parsing created phantom nodes from port identifiers
Fixed Block diagrams — Nodes were oversized (54px vs official 26px); reduced padding for more compact layout
Fixed Gantt charts — Row height and bar height were too large; made charts more compact
Fixed Requirement diagrams — Element nodes forced to minimum height of Requirement nodes (168px vs needed 102px)
Fixed Pie charts — Legend labels showed "{label} — {value} ({percent}%)" instead of official format "{label} [{value}]"
Fixed State diagrams — Nested composites laid out flat; nodes like "Stopped" rendered inside composite boxes they don't belong to. Now processes inner composites first and pushes non-members outside bounds.
Fixed Flowchart edge routing — Port ordering used raw source coordinates, causing near-coincident sources to get misleading port assignments. Now uses approach-angle heuristic (dx/|dy|) so edges entering a node are ordered by their actual approach direction. Also increased port padding to keep ports further from node edges.

Diagram Type Status

Type	Examples	Status	Notes
Flowchart	14	Good	Minor edge routing differences
Sequence	8	Good	Alias bug fixed; minor activation box differences
Class	6	Good	Working correctly
State	7	Good	Nested composites fixed; minor fork/join differences
ER	4	Good	Cardinality markers functional
Pie	2	Good	Legend format fixed to match official
Mindmap	4	Good	Working correctly
Journey	3	Issues	Missing emotion circles for some actors
Timeline	3	Issues	Simplified rendering, fewer decorative elements
Gantt	5	Good	Compact layout; missing weekend exclusion markers
Requirement	1	Good	Element sizing fixed
GitGraph	4	Good	Working correctly
Quadrant	3	Issues	Missing some grid lines
XY Chart	4	Issues	Simplified data visualization
ZenUML	1	Issues	Unsupported diagram type
Block	1	Good	Compact layout after fix
Architecture	1	Good	Icons and port parsing fixed
C4	2	Issues	Basic support only
Sankey	1	Good	Working correctly
Packet	1	Issues	Basic support
Kanban	1	Good	Working correctly
Radar	1	Issues	Basic support

Remaining Issues by Type

Flowchart Minor

Edge curves less smooth than official

mmdr uses Bezier curves but with less optimized control points than the official D3-based renderer. Edges are functional but slightly more angular.

Multi-edge convergence spacing

When multiple edges converge on the same node, they don't separate as cleanly as the official output.

Sequence Minor

Activation boxes simplified

mmdr renders activation boxes but with slightly different sizing/positioning compared to official.

State Minor

Fork/join node rendering

Fork/join nodes use a slightly different visual approach (more circle elements) compared to official.

Journey Moderate

Missing emotion circles for some actors

In multi-actor journeys, some emotion indicator circles may be missing. The shopping journey shows ~28 circles vs official's ~48.

Fewer connecting lines

Journey diagrams have fewer decorative lines compared to official (1 vs 4-14).

Timeline Moderate

Simplified visual rendering

Timeline diagrams use fewer visual elements (paths, lines) than the official output, resulting in a more simplified appearance.

Gantt Minor

Missing weekend exclusion markers

Official renderer shows gray background for weekends/holidays; mmdr does not render these exclude ranges.

Grid density

mmdr shows ticks every 2-3 days vs official's every-day ticks.

Quadrant Chart Moderate

Missing grid lines

mmdr renders 2 grid lines vs official's 6, missing some quadrant divider lines.

XY Chart Moderate

Simplified data visualization

XY charts have fewer path elements for data series (2-3 vs 15-26), suggesting simplified line/bar rendering.

Missing axis labels

Some axis labels or data labels may be missing compared to official output.

C4 Diagram Moderate

Basic support only

C4 diagrams render with basic functionality but may lack some C4-specific visual conventions (relationship labels, container boundaries).

ZenUML Moderate

Unsupported diagram type

ZenUML diagrams are not currently supported by mmdr.

ER Diagram Minor

Crow's foot style difference

mmdr uses straight-line V shapes for crow's foot markers vs official's curved paths. Functionally correct but visually different.

Requirement Minor

Text positioning

mmdr uses left-aligned SVG text elements vs official's centered foreignObject HTML. Content is correct but alignment differs.

Overall Assessment

Out of 22 diagram types with 77 comparison examples:

14 types render well with only minor cosmetic differences (Flowchart, Sequence, Class, State, ER, Pie, Mindmap, Gantt, Requirement, GitGraph, Block, Architecture, Sankey, Kanban)
5 types have moderate issues that could be improved (Journey, Timeline, Quadrant, XY Chart, C4)
3 types have basic/limited support (ZenUML, Packet, Radar)
0 types have critical rendering failures

The core diagram types (flowchart, sequence, class, state, ER, gantt) all render correctly and closely match the official output.

mmdr Rendering Issues Tracker