Zoom and full screen
How a diagram is sized
- A diagram wider than the page is scaled down to fit the page's width, but never so far that its text becomes too small to read. A very wide diagram starts at its left edge at a readable size: drag it to see the rest, or press Zoom out once to see all of it. Its proportions stay the same.
- A small diagram keeps its own size. It is never enlarged.
- The macro's box is as tall as the diagram, so there is no empty space below it.
- When the page gets wider or narrower, the diagram follows.
Zoom and move
Four buttons sit at a diagram's top right: Zoom in, Zoom out, Reset zoom and Full screen. They show whenever the diagram is shown smaller than its own size or does not fit, in a slim strip of their own above the diagram, so they never cover it. On a small diagram they appear over its top right corner when you point at it or reach it with the Tab key. Point at a button, or tab to it, and its name shows next to it.
| To | Mouse or trackpad | Touch screen | Keyboard (a button focused) |
|---|---|---|---|
| Zoom in or out | the buttons, or Ctrl and the mouse wheel; a trackpad pinch | the buttons, or pinch with two fingers | + and - |
| Back to the starting size | Reset zoom | Reset zoom | 0 |
| Move around a zoomed diagram | drag it | drag it with one finger | the arrow keys |
| Full screen | Full screen | Full screen | Enter on the Full screen button |
| Leave full screen | Exit full screen | Exit full screen | Escape |
- You can zoom up to eight times the starting size. Zoom out goes down to the whole diagram.
- Dragging moves the diagram; it does not select the text.
- The mouse wheel alone scrolls the page as usual. It zooms only with Ctrl held, or in full screen.
- On a touch screen, one finger scrolls the page over a diagram at its starting size; once you zoom in, one finger moves the diagram. Two fingers always zoom the diagram, not the page.
- A printed page and a PDF show the whole diagram at the page's width, without the buttons; a tall one is made smaller to fit one page while it stays readable (export).
Full screen
Full screen fills your screen with the diagram, fitted to the screen. Zoom and drag work there too, and the mouse wheel zooms without Ctrl. Press Escape or Exit full screen to go back. The button shows only where the browser allows full screen.
Screen readers
- After each zoom, a screen reader hears the new size, such as "Zoom 75%", or "Whole diagram shown" when you zoom out to all of it. Focus stays where it is.
- A diagram is named "Diagram", or "Diagram:" and its own title when the Mermaid text gives one with
accTitle:. A description given withaccDescr:stays in the drawing for screen readers.
In the editing window
The window's preview shows the diagram at its own size, without the zoom buttons. A large diagram scrolls inside the preview.
Not inside an expand
Confluence does not allow the macro inside an expand: the editor places it below the expand, and it cannot be dragged in. Put the macro after the expand, or in a page section of its own.
Not yet
- A size setting per macro is not offered: every diagram fits the page's width.