Javascript - печать на странице PDF не в состоянии

Question

Я работаю над программой, которая при запуске запускает загрузку файла pdf из моей директории в веб-браузер.В браузере у меня есть возможность нажать на штамп, перетащить и переместить в любую нужную мне позицию и поставить штамп на PDF.Однако после того, как я проштамповал его, штамп не в том положении, в котором я планировал.

Ниже приведен пример снимка:

Ниже выводитсяпосле вставки (это не то, что я хочу):

Javascript:

function divMove(e){
        var div = document.getElementById('stamp');
        div.style.position = 'absolute';
        //div.style.top = e.clientY + 'px';
        //div.style.left = e.clientX + 'px';
        var box = div.getBoundingClientRect();
        mouse_top = e.clientY;
        mouse_left = e.clientX;
        var diff_x = mouse_left - box.left;
        var diff_y = mouse_top - box.top;
        div.style.top = ((Number(div.style.top.replace("px", "")) - 1) + diff_y) +"px";
        div.style.left = ((Number(div.style.left.replace("px", "")) - 1) + diff_x) +"px";
        document.getElementById("data").innerHTML =
            "mouse_top:" + mouse_top + "<br>mouse_left:" + mouse_left
    }

    function save(){
        $.ajax({
            type: "GET",
            url: "Save",
            data: {
                mouseTop : (mouse_top/96)*1,
                mouseLeft : (mouse_left/96)*3500
            },
            dataType: "text",
            success: function (response) {
            //use response to set stamp
                if (response != null) {
                    var pdfAsArray = convertDataURIToBinary("data:application/pdf;base64, " + response);
                    loadPDFToViewer(pdfAsArray);
                    //document.getElementById("page-1").getElementsByClassName("pdfCanvas")[0].removeEventListener("click", addStamp);
                } else {
                    alert("Response is null");
                }
            }
        });
    }

Backend (Java):

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
    {
        //String src = "C:\\Apache Tomcat\\apache-tomcat-7.0.78\\myWork\\prototype\\haito.pdf";
        //String dest = "C:\\Apache Tomcat\\apache-tomcat-7.0.78\\myWork\\prototype\\test.pdf";

        Properties p = new Properties();
        p.load(new FileInputStream("config.properties"));

        String src = p.getProperty("src");
        String dest = p.getProperty("dest");
        String imgSrc = p.getProperty("stamp");

        PdfDocument doc = new PdfDocument(new PdfReader(src), new PdfWriter(dest));


        ImageData image = ImageDataFactory.create(imgSrc);

        float w = image.getWidth();
        float h = image.getHeight();
        System.out.println("w: " + w + ", h: " + h);





        float mouseX = Float.valueOf(request.getParameter("mouseTop"));
        float mouseY = Float.valueOf(request.getParameter("mouseLeft"));
        System.out.println("top: " + mouseX + ", left: " + mouseY);
        //  adjusted mouse X and mouse Y position




        Rectangle rect = new Rectangle(mouseX ,mouseY  ,w,h);
        PdfStampAnnotation stamp = new PdfStampAnnotation(rect).setStampName(new PdfName("Approved"));
        PdfFormXObject xObj = new PdfFormXObject(new Rectangle(w,h));
        PdfCanvas canvas = new PdfCanvas(xObj,doc);
        canvas.addImage(image,0,0,false);

        //canvas.getGraphicsState();
        stamp.setNormalAppearance(xObj.getPdfObject());
        stamp.setFlags(PdfAnnotation.PRINT);
        stamp.setFlags(PdfAnnotation.LOCKED);
        for(int i=1;i<=doc.getNumberOfPages();i++)
        {
            doc.getPage(i).addAnnotation(stamp);
        }
        //doc.getFirstPage().addAnnotation(stamp);
        FileOutputStream out = new FileOutputStream("config.properties");
        p.setProperty("src", dest);
        p.setProperty("dest", src);
        p.store(out, null);
        out.close();
        doc.close();

Я боролся с этим вопросом в течение нескольких дней.Буду признателен за любую помощь.Есть ли способ сделать позицию точной?

Answer 1

Ваш вызов canvas.addImage передает 0, 0 в качестве координат x и y.Вместо этого вы должны передавать свои правильно переведенные координаты из координат мыши.Помните, что в PDF все рассчитывается снизу, поэтому y = 0 - это нижняя часть страницы, а не верхняя часть.

Кроме того, возможно, есть лучший способ выполнить штамповку, используя некоторые примеры из iText.как вы найдете здесь: https://developers.itextpdf.com/question/how-stamp-image-existing-pdf-and-create-anchor

PdfReader readerOriginalDoc = new PdfReader("src/main/resources/test.pdf");            
PdfStamper stamper = new PdfStamper(
    readerOriginalDoc, new FileOutputStream("NewStamper.pdf"));
PdfContentByte content = stamper.getOverContent(1);
Image image = Image.getInstance("src/main/resources/images.jpg");
image.scaleAbsolute(50, 20);
image.setAbsolutePosition(100, 100);
image.setAnnotation(new Annotation(0, 0, 0, 0, 3));
content.addImage(image);
stamper.close();

ОБНОВЛЕНИЕ: Вот пример того, как решить, какое расположение PDF должно быть основано на сообщенном позиционировании браузера:

docHeight = something; // however you choose to find the height of your document area
docWidth = something; // however you choose to find the width of your document area
mouse_top = e.clientY;
mouse_left = e.clientX;
percentTop = mouse_top / docHeight;
percentLeft = mouse_left / docWidth;

ОБНОВЛЕНИЕ:ширина и высота могут быть определенным элементом в вашей разметке или во всем документе.Таким образом, вы можете получить ширину и высоту следующим образом:

var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

Теперь передайте эти проценты бэкэнду, и вы можете работать в обратном порядке, чтобы найти ваши координаты PDF:

float percentBottom = 100.0 - Float.valueOf(request.getParameter("percentTop"));
float percentLeft = Float.valueOf(request.getParameter("percentLeft"));

Нижняя частьтеперь переводится в процентах от общей высоты, которую вам нужно поднять снизу страницы, чтобы получить правильную верхнюю позицию.Левая позиция должна быть одинаковой в процентном отношении.Я надеюсь, что это помогает.