Set paper height based on content



  • I'm trying to generate a PDF (using chrome-pdf) to be printed on a receipt printer. This means that the paper size is 8cm wide and has practically infinite height. In order for the printout to print correctly I need to set the paper height to the height of the content. Otherwise, I get very long receipts with lots of white space.

    The problem is that I can set the page width and height in template, which works fine, but I don't know what will be the height of generated receipt. I've tried so far to add a script to HTML template, which measures the page and adds a CSS rule with @page { size: ... }, but that gives me unpredictable and unexpected results (width is wrong, orientation sometimes changes, etc.).

    Is there a way to add a script to a template that can access both HTML DOM to measure the content and configure JS Report page height?

    Appreciate any help.



  • You can do this

    
    <script>
        window.JSREPORT_CHROME_PDF_OPTIONS = {
            height: '300px'
        }
    </script>
    

    https://playground.jsreport.net/w/anon/m1x96vVn

    But not sure if you will be able to find a correct height in the dom.



  • Thank @jan_blaha very much! That did the trick!

    "Full" solution for the benefit of others:

    <script>
        window.onload = function() {
            window.JSREPORT_CHROME_PDF_OPTIONS = {
                height: (document.body.scrollHeight + 100).toFixed(0) + 'px',
            };
        };
    </script>
    

    * +100 is extra space for margins I'm using


Log in to reply
 

Looks like your connection to jsreport forum was lost, please wait while we try to reconnect.