Pdf-utils documentation



  • I try create simple pdf with footer and header. It create both on one place.
    I hope for help because obviously my Columbo skills are poor for search solution in github or somewhere.

    My vision -> I would like create page with picture in header, pager in footer and content ofcourse.

    My sample code

    		await jsreport.documentStore.collection('templates').insert({
    			content: '<div style"height: 15mm;background-color: yellow;">Vokurka</div>',
    			shortid: 'header',
    			name: 'header',
    			engine: 'none',
    			chrome: {
    				width: '15mm',
    				height: '15mm'
    			},
    			recipe: 'chrome-pdf'
    		})
    
    		await jsreport.documentStore.collection('templates').insert({
    			content: '<div style"height: 20mm;background-color: cyan;">Kedlubna</div>',
    			shortid: 'footer',
    			name: 'footer',
    			engine: 'none',
    			chrome: {
    				width: '15mm',
    				height: '15mm'
    			},
    			recipe: 'chrome-pdf'
    		})
    
    		resp = await jsreport.render({
    			template: {
    				content: '<p><%= magicWord %> je male zviratko</p>',
    				engine: 'ejs',
    				recipe: 'chrome-pdf',
    				pdfOperations: [
                                                    { type: 'merge', renderForEveryPage: true, templateShortid: 'header' },
                                                    { type: 'merge', renderForEveryPage: true, templateShortid: 'footer' }
                                                   ],
    				chrome: {
    					//waitForJS: true,
    					format: 'A6',
    					landscape: true,
    					marginTop: '20mm',
    				}
    			},
    			data: {
    				magicWord: "Telatko",
    			},
    
    		})
    


    1. You should be able to reach the goals you mentioned also with the native header and footer. https://jsreport.net/learn/chrome-pdf#native-headers-and-footers

    2. It is better for beginners to start jsreport studio and design the template you need there. If you want to do everything dynamically in node you can check the data files studio creates and repeat the same.

    3. There are some problems in the particular code you shared.

    • you should not mix page sizes when merging multiple pdfs. So remove the format and chrome width/height.
    • don't mix page orientation when merging pdfs. So remove chrome.landscape
    • the both header and footer are rendered to the same place. Make sure you position footer to the page bottom
    • you are missing chrome marginBottom in the main page

    The best is really to open studio and check examples in the docs
    https://jsreport.net/learn/pdf-utils
    For example this one
    https://playground.jsreport.net/w/anon/BkEHf9MNG-5



  • Ad 1 Yes, but i simplify my solution. For example content 'Vokurka' could be '{{$pdf.pageNumber}}/{{$pdf.pages.length}} ta Vokurka'.
    Ad 2 Is it possible get source code from studio, I did not find it (please explain me)
    Ad 3 3.bullet I did not find it how to define position from doc and GitHub neither.


Log in to reply
 

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