0

I'm trying to embedd an image into a PDF with jsPDF. For some reason this is not working . This is the Code when I create my PDF:

  exportPDF () {
     const doc = new jsPDF('p', 'pt')
     var footer = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAC...'
     var header = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgA...'
  
  /* Some other stuff */

      doc.addImage(this.output, 'PNG', 400, 400, 500, 500) #This does not work
      doc.addImage(header, 'PNG', 0, 0, 600, 139.86) #For some reason these images work
      doc.addImage(footer, 'PNG', 0, 800, 600, 54.68)

  /* Some other stuff */

      doc.save('Containertreppen Teileliste.pdf')
  }

The Variable output is passed from another page and therefore not created in the method (I'm using vuejs). In this Variable the Screenshot of a Babylonjs Scene is stored, encoded in base64.

This is the Code when a take the Screenshot:

printDiv() {
  this.scene.render();
  const self = this
  const options = {
    type: "dataURL",
  };
  
  this.$html2canvas(document.getElementById("renderCanvas"), options).then(function(canvas){
    self.output = canvas
  })
},

I'm able to display the screenshot in an HTML-element and I can download it as a normal png but for some reason when I try to add it to my PDF the following error occurs in my console:

Error in v-on handler: "Error: Supplied Data is not a valid base64-String jsPDF.convertStringToImageData"

I also tried to put the String as src for an HTML-image-element but it changed nothing. This is the beginning of the Variable output:

"data:image/png;base64,iVBORw..."

Can someone help me with this?

0 Answers0