How can I convert a bpmn file into pdf?

Users
1

How can I convert a bpmn file into pdf?

2

Use this: https://github.com/bpmn-io/bpmn-to-image

3 
async function downloadPDF() {
  try {
    const { svg } = await modeler.saveSVG();

    
    const canvas = document.createElement("canvas");
    const ctx = canvas.getContext("2d");


    const parser = new DOMParser();
    const svgDocument = parser.parseFromString(svg, "image/svg+xml");
    const svgElement = svgDocument.querySelector("svg");

    if (!svgElement) {
      throw new Error("El SVG no pudo ser parseado correctamente.");
    }

    const svgWidth = parseFloat(svgElement.getAttribute("width")) || 500;
    const svgHeight = parseFloat(svgElement.getAttribute("height")) || 500;

    
    canvas.width = svgWidth;
    canvas.height = svgHeight;

    
    const v = await Canvg.from(ctx, svg, { ignoreDimensions: false });
    await v.render();

    
    const doc = new jsPDF();

    
    const pdfWidth = 190;
    const pdfHeight = (svgHeight / svgWidth) * pdfWidth; 

    
    const imgData = canvas.toDataURL("image/png");

    
    doc.addImage(imgData, "PNG", 10, 10, pdfWidth, pdfHeight);

    
    doc.save("diagram.pdf");
  } catch (err) {
    console.error("Error generating PDF: ", err);
  }
}
4

I’ve created a tool to convert BPMN files to PDF.

It’s free.
No email or sign-up is required.
It runs locally.

Features:

  1. Convert one .bpmn to PDF
  2. Convert many .bpmn files to a .zip of PDFs (attached image)
  3. Download PDF or PNG
  4. Display a diagram title
  5. Change layout and rotation

Try it here: Free BPMN to PDF Converter | Convert BPMN Files Online | BA Copilot

Let me know what you think!

Example of downloading 2 .bpmn files as a .zip of PDFs:

BPMN to PDF converter
BPMN to PDF converter2501×1915 197 KB

1 Like