Search code examples
reactjscanvaskonvajsreact-konvakonva

Convert Konva-Canvas into PDF using React-Konva

Hello i have implemented on how to save the canvas in png and jpeg but i would like to save it into pdf i have seen the code for JavaScript from here:https://konvajs.org/docs/sandbox/Canvas_to_PDF.html i would like to know how it can be implemented in React here is my demo code: https://codesandbox.io/s/react-canvas-n779q2?file=/src/App.js

Solution

  • All you need is a reference to the Konva Stage. Then you can do:

    var pdf = new jsPDF('l', 'px', [stage.width(), stage.height()]);
pdf.addImage(
  stage.toDataURL({ pixelRatio: 2 }),
  0,
  0,
  stage.width(),
  stage.height()
);

pdf.save('canvas.pdf');