https://github.com/joshua-gould/canvas2pdf
Export your HTML canvas to PDF
https://github.com/joshua-gould/canvas2pdf
canvas canvas-context html-canvas javascript node-canvas nodejs pdf pdfkit
Last synced: about 1 year ago
JSON representation
Export your HTML canvas to PDF
- Host: GitHub
- URL: https://github.com/joshua-gould/canvas2pdf
- Owner: joshua-gould
- License: mit
- Created: 2017-08-15T18:24:09.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2024-01-10T22:00:20.000Z (over 2 years ago)
- Last Synced: 2025-04-14T16:18:56.050Z (about 1 year ago)
- Topics: canvas, canvas-context, html-canvas, javascript, node-canvas, nodejs, pdf, pdfkit
- Language: JavaScript
- Homepage:
- Size: 2.41 MB
- Stars: 225
- Watchers: 4
- Forks: 39
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Canvas2PDF
Canvas2PDF exports your HTML canvas as PDF using JavaScript.
Note that this library generates actual PDF drawing calls to create a PDF with vector graphics,
unlike some alternate libraries which rasterize your canvas and place it as an image in your PDF.
## Usage
```javascript
import PdfContext from "/src/canvas2pdf";
import blobStream from "blob-stream";
import { saveAs } from "file-saver";
// Create a new PDF canvas context.
const ctx = new PdfContext(blobStream());
// draw your canvas like you would normally
ctx.fillStyle = "yellow";
ctx.fillRect(100, 100, 100, 100);
// more canvas drawing, etc...
// convert your PDF to a Blob and save to file
ctx.stream.on("finish", function () {
const blob = ctx.stream.toBlob("application/pdf");
saveAs(blob, "example.pdf", true);
});
ctx.end();
```
## Interactive Browser Demo
[Open Demo](https://joshua-gould.github.io/canvas2pdf/dist/index.html)
## Notes
- Calling fill and then stroke consecutively only executes fill
- Some canvas 2d context methods are not implemented yet (e.g. arcTo)
## License
MIT
## Developer Dependencies
- GraphicsMagick is required for running tests