Module viewer

The viewer module contains everything you need to display interactive diagrams created with either DiagramEditor or in code.

The core class here is DiagramViewer. It represents the viewer web component.

Example

Here's a basic scenario for adding a Flowchart viewer on your page.

In the markup part add the diagram viewer web component:

<mjs-diagram-viewer id="mjsDiaViewer"></mjs-diagram-viewer>
Copy

Then in your code configure it to use the flowchart stencil set and pass the previously created diagram to the show method:

import * as mjsdv from "@markerjs/mjs-diagram/viewer";
import * as flowchart from "@markerjs/mjs-diagram/stencilsets/flowchart/flowchart";

const viewer = document.getElementById("mjsDiaViewer");
viewer.stencilSet = flowchart.flowchartStencilSet;
viewer.show(diagram);
Copy