Question

在这里，我正在尝试在使用PDFJS渲染PDF的画布中绘制一个对象。当我尝试移动对象时，可以在画布上绘制该对象。

我认为fabricJS和pdfJS之间没有交互。请帮我解决这个问题

加载PDF后，将鼠标移到pdf的中心，您可以在其中看到鼠标光标的变化，一旦单击它，尝试将对象移动到画布的左上方。

    //pdfjs stuff
var url = 'https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/web/compressed.tracemonkey-pldi-09.pdf';
PDFJS.disableWorker = true;
PDFJS.getDocument(url).then(function (pdf) {
  pdf.getPage(1).then(function (page) {
    var scale = 1.5;
    var viewport = page.getViewport(scale);
    var canvas = document.getElementById('pdfcanvas');
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;
    page.render({canvasContext: context, viewport: viewport});
  });
});

//fabricjs stuff
var fcanvas = new fabric.Canvas("pdfcanvas", {selection: false});
fcanvas.setWidth(300);
fcanvas.setHeight(300);
var rect = new fabric.Rect({
            left: 100,
            top: 100,
            width: 50,
            height: 50,
            fill: '#FF454F',
            opacity: 0.5,
            transparentCorners: true,
            borderColor: "gray",
            cornerColor: "gray",
            cornerSize: 5
        });
 fcanvas.add(rect);
 fcanvas.renderAll();

预先感谢

Fabric JS：如何在现有画布上绘制画布中的对象，从而使用PDFJS渲染PDF

0 个答案: