Groot mermaid-diagram: scrollbaar in de slide (editor + live, publiek volgt mee), export passend

brenno commented

2026-07-26 08:58:47 +00:00

Owner

Vervolg op #868. Sinds #868 schaalt een groot diagram netjes passend binnen de slide, maar een écht groot/complex schema wordt daardoor klein. Gewenst gedrag (met de gebruiker afgestemd): een te groot diagram wordt scrollbaar in de slide zelf op de interactieve oppervlakken, terwijl de statische export passend blijft.

Bereik (afgestemd):

Editor-preview + live presentatie: een diagram dat te groot is om leesbaar te passen, wordt op leesbare schaal in een scrollvenster getoond i.p.v. verder te verkleinen.
Publieksvenster (beamer): spiegelt de scrollpositie van de presentator (gesynchroniseerd, in de geest van de bestaande tabel-sync).
PDF/PPTX-export (slide_rasterizer.dart, vaste slidemaat): blijft passend — een statische pagina kan niet scrollen; toont het hele diagram geschaald.
HTML-export: eigen renderpad (marp-html + mermaid.js); apart bekijken, mag later.

Aanpak:

Een contextvlag ('mag-scrollen'/interactief) naar MermaidDiagram threaden: aan voor de interactieve oppervlakken, uit voor de rasterizer (→ de bestaande _fittedDiagramSize-passing).
Een leesbaarheidsgrens: alleen scrollen zodra de passing onder een leesbare schaal zakt; kleine diagrammen blijven gewoon passend zonder scrollbalk.
Scrollpositie-sync presentator → publieksvenster.

Visueel te verifiëren op editor, presentator, publieksvenster én een PDF/PPTX-export (die passend moet blijven).

Vervolg op #868. Sinds #868 schaalt een groot diagram netjes passend binnen de slide, maar een écht groot/complex schema wordt daardoor klein. Gewenst gedrag (met de gebruiker afgestemd): een te groot diagram wordt **scrollbaar in de slide zelf** op de interactieve oppervlakken, terwijl de statische export passend blijft. **Bereik (afgestemd):** - **Editor-preview + live presentatie**: een diagram dat te groot is om leesbaar te passen, wordt op leesbare schaal in een scrollvenster getoond i.p.v. verder te verkleinen. - **Publieksvenster (beamer)**: spiegelt de scrollpositie van de presentator (gesynchroniseerd, in de geest van de bestaande tabel-sync). - **PDF/PPTX-export** (`slide_rasterizer.dart`, vaste slidemaat): blijft **passend** — een statische pagina kan niet scrollen; toont het hele diagram geschaald. - **HTML-export**: eigen renderpad (marp-html + mermaid.js); apart bekijken, mag later. **Aanpak:** - Een contextvlag ('mag-scrollen'/interactief) naar `MermaidDiagram` threaden: aan voor de interactieve oppervlakken, uit voor de rasterizer (→ de bestaande `_fittedDiagramSize`-passing). - Een leesbaarheidsgrens: alleen scrollen zodra de passing onder een leesbare schaal zakt; kleine diagrammen blijven gewoon passend zonder scrollbalk. - Scrollpositie-sync presentator → publieksvenster. Visueel te verifiëren op editor, presentator, publieksvenster én een PDF/PPTX-export (die passend moet blijven).

brenno added the

enhancement

accepted

labels

2026-07-26 09:14:02 +00:00

brenno referenced this issue

2026-07-26 10:30:59 +00:00

Mermaid rendert niet op macOS-desktop (WebView Promise), PDF/PPTX-export van diagram-dia's leeg #882

brenno referenced this issue from a commit

2026-07-26 11:28:50 +00:00

feat(mermaid): fundering voor scrollbaar groot diagram (#872)

brenno referenced this issue from a commit