Как отобразить PDF на холсте, используя angular7 и ткань JS

Question

Я хочу отобразить PDF как изображение на холсте, используя angular7 и ткань js

Я не могу найти какой-либо код, чтобы попробовать в angular7

Answer 1

Другой способ с fabric.js Необходимо импортировать импорт 'ткань';и объявить объявить const fabric: any;

myMethod () {

var canvas = new fabric.Canvas ('main', {renderOnAddRemove: false});

canvas.setHeight (1200);

canvas.setWidth (700);

var myCanvas = document.getElementById ("my_canvas");

var c1 = new fabric.Image(myCanvas, {слева: (100 - 256) / 2, сверху: (300 - 256) / 2,}) canvas.add (c1);canvas.renderAll ();}

Answer 2

Наконец-то я смог решить эту проблему ... Я использовал pdfjsLib и импортировал в свой файл ts (импорт * как pdfjsLib из 'pdfjs-dist / build / pdf';)

 public src="/assets/myPhotos.pdf";
 showPdf(){
pdfjsLib.getDocument(this.src).then(doc =>{

 // console.log("this file has "+ doc._pdfInfo.numPages+ "pages");
  doc.getPage(1).then(page => {
    var myCanvas =  <HTMLCanvasElement>document.getElementById("my_canvas");
    var context = myCanvas.getContext("2d");
    var scale = 1.5;
    var viewport = page.getViewport(scale);
    myCanvas.width = viewport.width;
    myCanvas.height = viewport.height;

    page.render({
      canvasContext : context,
      viewport : viewport
    })
  })
});

}