# svg2jspdf

![GitHub license](https://img.shields.io/github/license/yet3/svg2jspdf?style=flat)
<a href='https://www.npmjs.com/package/@yet3/svg2jspdf'>
![npm](https://img.shields.io/npm/v/@yet3/svg2jspdf)
</a>

I was making a pdf using [jsPDF](https://github.com/parallax/jsPDF) and wanted to insert svg into pdf without transforming it into image so I made this.

## Installation

```sh
npm install @yet3/svg2jspdf
```

or

```sh
yarn add @yet3/svg2jspdf
```

## Usage

```js
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

```js
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

```ts
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

```ts
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