Javascript в PDF, отзывчивый отсекает документ - PullRequest
Новая
       8

Javascript в PDF, отзывчивый отсекает документ

0 голосов
/ 23 октября 2018

Я пытаюсь создать PDF с jsPDF и html2canvas.

Все отлично работает на рабочем столе.Я дал моему html статическую ширину и прочее, чтобы оно соответствовало моему вырезу jsPDF.

Когда я подхожу к своему телефону и пробую функцию, он обрезает большую часть изображения.Я думаю, что это из-за размера экрана, у кого-нибудь есть решение для этого?

Мне просто нужно, чтобы вырез html2canvas был точно таким же, как на рабочем столе.

Вот мои html2canvas и jsPDF: 

capture () {
      var capture = document.getElementById('capture')
      capture.style.display = 'none;'
      var image = document.getElementById('canvas')
      html2canvas(image).then(function (canvas) {
        var pdf = new JsPDF('p', 'pt', 'a4')
        for (var i = 0; i <= image.clientHeight / 980; i++) {
          //! This is all just html2canvas stuff
          var srcImg = canvas
          var sX = 0
          var sY = 1120 * i // start 980 pixels down for every new page
          var sWidth = 830
          var sHeight = 1120
          var dX = 0
          var dY = 0
          var dWidth = 830
          var dHeight = 1120
          var onePageCanvas = document.createElement('canvas')
          onePageCanvas.setAttribute('width', 830)
          onePageCanvas.setAttribute('height', 1120)
          var ctx = onePageCanvas.getContext('2d')
          // details on this usage of this function:
          // https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Using_images#Slicing
          ctx.drawImage(srcImg, sX, sY, sWidth, sHeight, dX, dY, dWidth, dHeight)

          // document.body.appendChild(canvas);
          var canvasDataURL = onePageCanvas.toDataURL('image/png', 1.0)
          var width = onePageCanvas.width
          var height = onePageCanvas.clientHeight
          // ! If we're on anything other than the first page,
          //  add another page
          if (i > 0) {
            pdf.addPage(595, 842) // 8.5" x 11" in pts (in*72)
          }
          // ! now we declare that we're working on that page
          pdf.setPage(i + 1)
          // ! now we add content to that page!
          pdf.addImage(canvasDataURL, 'PNG', 0, 0, (width * 0.72), (height * 0.71))
        }
        pdf.deletePage(5)
        pdf.save('Wehappy-monthlyReport.pdf')
      })
    }

Заранее спасибо - Андерс

...