Add support for 'evenodd' fill rule

Nicodemos234 · Nov 9, 2023 · cf1d601 · cf1d601
1 parent 0698125
commit cf1d601
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 3 deletions.
diff --git a/src/api/PDFPage.ts b/src/api/PDFPage.ts
@@ -14,6 +14,7 @@ import {
   translate,
   LineCapStyle,
   scale,
+  FillRule,
 } from './operators';
 import PDFDocument from './PDFDocument';
 import PDFEmbeddedPage from './PDFEmbeddedPage';
@@ -1240,6 +1241,7 @@ export default class PDFPage {
       1,
     );
     assertIsOneOfOrUndefined(options.blendMode, 'options.blendMode', BlendMode);
+    assertIsOneOfOrUndefined(options.fillRule, 'options.fillRule', FillRule);
 
     const graphicsStateKey = this.maybeEmbedGraphicsState({
       opacity: options.opacity,
@@ -1265,6 +1267,7 @@ export default class PDFPage {
         borderDashPhase: options.borderDashPhase ?? undefined,
         borderLineCap: options.borderLineCap ?? undefined,
         graphicsState: graphicsStateKey,
+        fillRule: options.fillRule,
       }),
     );
   }

diff --git a/src/api/PDFPageOptions.ts b/src/api/PDFPageOptions.ts
@@ -1,7 +1,7 @@
 import { Color } from './colors';
 import PDFFont from './PDFFont';
 import { Rotation } from './rotations';
-import { LineCapStyle } from './operators';
+import { FillRule, LineCapStyle } from './operators';
 
 export enum BlendMode {
   Normal = 'Normal',
@@ -74,6 +74,7 @@ export interface PDFPageDrawSVGOptions {
   borderDashPhase?: number;
   borderLineCap?: LineCapStyle;
   blendMode?: BlendMode;
+  fillRule?: FillRule
 }
 
 export interface PDFPageDrawLineOptions {

diff --git a/src/api/operations.ts b/src/api/operations.ts
@@ -31,6 +31,8 @@ import {
   clip,
   endPath,
   appendBezierCurve,
+  FillRule,
+  fillEvenOdd,
 } from './operators';
 import { Rotation, degrees, toRadians } from './rotations';
 import { svgPathToOperators } from './svgPath';
@@ -348,6 +350,7 @@ export const drawSvgPath = (
     borderDashPhase?: number | PDFNumber;
     borderLineCap?: LineCapStyle;
     graphicsState?: string | PDFName;
+    fillRule?: FillRule
   },
 ) =>
   [
@@ -369,7 +372,7 @@ export const drawSvgPath = (
 
     // prettier-ignore
     options.color && options.borderWidth ? fillAndStroke()
-  : options.color                      ? fill()
+  : options.color                      ? options.fillRule === FillRule.EvenOdd ? fillEvenOdd() : fill()
   : options.borderColor                ? stroke()
   : closePath(),
 

diff --git a/src/api/operators.ts b/src/api/operators.ts
@@ -185,8 +185,15 @@ export const square = (xPos: number, yPos: number, size: number) =>
 
 export const stroke = () => PDFOperator.of(Ops.StrokePath);
 
+export enum FillRule {
+  NonZero = 'f',
+  EvenOdd = 'f*'
+}
+
 export const fill = () => PDFOperator.of(Ops.FillNonZero);
 
+export const fillEvenOdd = () => PDFOperator.of(Ops.FillEvenOdd);
+
 export const fillAndStroke = () => PDFOperator.of(Ops.FillNonZeroAndStroke);
 
 export const endPath = () => PDFOperator.of(Ops.EndPath);

diff --git a/src/api/svg.ts b/src/api/svg.ts
@@ -16,7 +16,7 @@ import {
 import PDFFont from './PDFFont';
 import PDFPage from './PDFPage';
 import { PDFPageDrawSVGElementOptions } from './PDFPageOptions';
-import { LineCapStyle, LineJoinStyle } from './operators';
+import { LineCapStyle, LineJoinStyle, FillRule } from './operators';
 import { Rectangle, Point, Segment, Ellipse } from '../utils/elements';
 import { getIntersections } from '../utils/intersections';
 import { distanceCoords, isEqual, distance, rotate } from '../utils/maths';
@@ -49,6 +49,7 @@ type InheritedAttributes = {
   strokeWidth?: number;
   strokeOpacity?: number;
   strokeLineCap?: LineCapStyle;
+  fillRule?: FillRule;
   strokeLineJoin?: LineJoinStyle;
   fontFamily?: string;
   fontStyle?: string;
@@ -119,6 +120,11 @@ const StrokeLineCapMap: Record<string, LineCapStyle> = {
   square: LineCapStyle.Projecting,
 };
 
+const FillRuleMap: Record<string, FillRule> = {
+  evenodd: FillRule.EvenOdd,
+  nonzero: FillRule.NonZero
+};
+
 const StrokeLineJoinMap: Record<string, LineJoinStyle> = {
   bevel: LineJoinStyle.Bevel,
   miter: LineJoinStyle.Miter,
@@ -754,6 +760,7 @@ const runnersToPage = (
       opacity: element.svgAttributes.fillOpacity,
       scale: element.svgAttributes.scale,
       rotate: element.svgAttributes.rotate,
+      fillRule: element.svgAttributes.fillRule,
     });
   },
   async image(element) {
@@ -977,6 +984,11 @@ const parseAttributes = (
     style,
     'stroke-linejoin',
   );
+  const fillRuleRaw = styleOrAttribute(
+    attributes,
+    style,
+    'fill-rule',
+  );
   const strokeWidthRaw = styleOrAttribute(attributes, style, 'stroke-width');
   const fontFamilyRaw = styleOrAttribute(attributes, style, 'font-family');
   const fontStyleRaw = styleOrAttribute(attributes, style, 'font-style');
@@ -1005,6 +1017,7 @@ const parseAttributes = (
     fillOpacity:
       parseFloatValue(fillOpacityRaw || opacityRaw || fillRaw?.alpha) ??
       inherited.fillOpacity,
+    fillRule: FillRuleMap[fillRuleRaw] || inherited.fillRule,
     stroke: strokeRaw?.rgb || inherited.stroke,
     strokeWidth: parseFloatValue(strokeWidthRaw) ?? inherited.strokeWidth,
     strokeOpacity: