fix pattern position (#212)

src/nodes/pattern.ts

@@ -12,27 +12,35 @@ export class Pattern extends NonRenderedNode {
       return
     }
 
+    const scaleFactor = context.pdf.internal.scaleFactor
+
     // the transformations directly at the node are written to the pattern transformation matrix
-    const bBox = this.getBoundingBox(context)
+    const x = context.svg2pdfParameters.x ?? 0
+    const y = context.svg2pdfParameters.y ?? 0
+    const [patternX, patternY, width, height] = this.getBoundingBox(context)
+    const startX = (patternX + x) * scaleFactor
+    const startY = (patternY + y) * scaleFactor
+    const endX = startX + width * scaleFactor
+    const endY = startY + height * scaleFactor
     const pattern = new TilingPattern(
-      [bBox[0], bBox[1], bBox[0] + bBox[2], bBox[1] + bBox[3]],
-      bBox[2],
-      bBox[3]
+      [startX, startY, endX, endY],
+      width * scaleFactor,
+      height * scaleFactor
     )
 
     context.pdf.beginTilingPattern(pattern)
     // continue without transformation
 
     for (const child of this.children) {
-      await child.render(
-        new Context(context.pdf, {
-          attributeState: context.attributeState,
-          refsHandler: context.refsHandler,
-          styleSheets: context.styleSheets,
-          viewport: context.viewport,
-          svg2pdfParameters: context.svg2pdfParameters
-        })
-      )
+      const childContext = new Context(context.pdf, {
+        attributeState: context.attributeState,
+        refsHandler: context.refsHandler,
+        styleSheets: context.styleSheets,
+        viewport: context.viewport,
+        svg2pdfParameters: context.svg2pdfParameters,
+        transform: context.pdf.Matrix(scaleFactor, 0, 0, scaleFactor, startX, startY)
+      })
+      await child.render(childContext)
     }
     context.pdf.endTilingPattern(id, pattern)
   }

test/common/tests.js

@@ -37,6 +37,8 @@ window.tests = [
   'nested-tspans',
   'opacity-and-rgba',
   'path-arc-support',
+  ['pattern-offset', undefined, { x: 10, y: 10 }],
+  ['pattern-scale', [400, 300, 'mm'], {}],
   'pattern-units',
   'patterns',
   'polyline',

test/unit/all.spec.js

@@ -22,7 +22,8 @@ for (const test of window.tests) {
     it(`testing ${name}`, async function() {
       const width = jsPDFOptions ? jsPDFOptions[0] : svgElement.width.baseVal.value
       const height = jsPDFOptions ? jsPDFOptions[1] : svgElement.height.baseVal.value
-      const pdf = new jsPDF(width > height ? 'l' : 'p', 'pt', [width, height])
+      const unit = jsPDFOptions ? jsPDFOptions[2] || 'pt' : 'pt'
+      const pdf = new jsPDF(width > height ? 'l' : 'p', unit, [width, height])
 
       if (name === 'custom-fonts') {
         const filename = '/base/test/specs/custom-fonts/Batang.ttf'