diff --git a/docs/how-to-create-a-complete-bill.md b/docs/how-to-create-a-complete-bill.md index 813660c..8313982 100644 --- a/docs/how-to-create-a-complete-bill.md +++ b/docs/how-to-create-a-complete-bill.md @@ -127,7 +127,7 @@ Because the coordinate system of a PDF is based on points, SwissQRBill provides import { mm2pt } from "swissqrbill/utils"; ``` -We use the [translate](http://pdfkit.org/docs/vector.html#transformations) method of `PDFDocument` to position the logo 2cm from the left side and 14mm from the top. Then we fill the path with our colors. +We use the [`translate()`](http://pdfkit.org/docs/vector.html#transformations) method of `PDFDocument` to position the logo 2cm from the left side and 14mm from the top. Then we fill the path with our colors. The `save()` and `restore()` methods are used to save the previous coordinates and restore them after the logo is rendered. This way we can change the positioning of the logo without affecting the rest of the document. #### Adding the addresses diff --git a/examples/how-to-create-a-complete-bill/src/index.js b/examples/how-to-create-a-complete-bill/src/index.js index e460857..3b59fe4 100644 --- a/examples/how-to-create-a-complete-bill/src/index.js +++ b/examples/how-to-create-a-complete-bill/src/index.js @@ -37,6 +37,7 @@ const data = { }; // Add logo +pdf.save(); pdf.translate(mm2pt(20), mm2pt(14)); pdf.path(logoBackground, mm2pt(20), mm2pt(14)) .fillColor("#EA5151") @@ -49,6 +50,7 @@ pdf.path(logo, mm2pt(20), mm2pt(14)) pdf.path(logoText, mm2pt(20), mm2pt(14)) .fillColor("#454141") .fill(); +pdf.restore(); // Add creditor address pdf.fontSize(12);