@yet3/svg2jspdf

svg2jspdf

I was making a pdf using jsPDF and wanted to insert svg into pdf without transforming it into image so I made this.

Installation

npm install @yet3/svg2jspdf

or

yarn add @yet3/svg2jspdf

Usage

import JsPdf from "jspdf";
import { addSvgFromFile, addSvgFromString } from "@yet3/svg2jspdf";

const thirdSvgString = `your svg`;
const doc = new JsPdf();

addSvgFromFile(doc, "./first-svg.svg");
addSvgFromFile(doc, "./second-svg.svg", { x: 30, y: 50 });
addSvgFromString(doc, thirdSvgString, { width: 35, height: "auto" });

doc.save("pdf.pdf");

or

import JsPdf from "jspdf";
import { Svg2Pdf } from "@yet3/svg2jspdf";

const thirdSvgString = `your svg`;
const doc = new JsPdf();
const svg2pdf = new Svg2Pdf(doc);

svg2pdf.fromFile("./first-svg.svg");
svg2pdf.fromFile("./second-svg.svg", { y: 10 });
svg2pdf.fromString(thirdSvgString, { height: 25 });

doc.save("pdf.pdf");

Exposed functions

setSvg2PdfHandler<T extends string>(tagName: T, handler: SvgHandler<T>): void
addSvgFromString(doc: JsPdf, svgString: string, options?: Svg2PdfOptions = {}): void
addSvgFromFile(doc: JsPdf, filePath: string, options?: Svg2PdfOptions = {}): void

Svg2Pdf methods

setHandler<T extends string>(tagName: T, handler: SvgHandler<T>): void
fromString(svgString: string, options?: Svg2PdfOptions): void
fromFile(filePath: string, options?: Svg2PdfOptions): void

Svg2PdfOptions

Name	Type	Default value
x	number | undefined	0
y	number | undefined	0
width	number | 'auto' | undefined	'auto'
height	number | 'auto' | undefined	'auto'

Supported svg tags

• path
• polygon
• polyline
• line
• rect
• circle