Skip to content

Generate PDF files with JavaScript and WASM (WebAssembly)

License

Notifications You must be signed in to change notification settings

wanghaisheng/pdf-genious

 
 

Repository files navigation

https://github.com/wanghaisheng/localpdfmerger

https://github.com/wanghaisheng/wechat2pdf

WASM-PDF

Generates PDF files directly in the browser with JavaScript and WASM (WebAssembly).

Build Status

Idea here is to push all the work involved in creating a PDF to the browser side, instead of using precious server resources.

Demos

Example that generates a sample PDF document from JSON file. Title in PDF is changed dynamically (in JavaScript) to show current date. Note: this example routes directly to the PDF data blob, so 2 backsteps are needed to return to this page.

Another example that generates 400 paragraphs of Lorem Ipsum and shows a download link when document has been generated (which is instantly 🙂). Also shows page numbers.

This example creates a task calendar.

Features

  • PDF contents are described as a JavaScript object and that gets passed to WASM-module, which generates the output
  • Customizable output handler (e.g. load blob URL to a link or directly to window)
  • Currently supported elements include:
    • Paragraphs/text elements with basic fonts (Helvetica, Times, Courier)
    • Images loaded from URL (converted automatically to bytes)
    • Tables with rows and cells
    • Spacers (they just eat space)
    • Paths with points, strokes, fills and alignment
    • Basic styling (all styling parameters are optional)
    • Custom template size (defaults to A4 portrait with 50 px margins)
    • Page numbers and stationary text can be included in template
    • Inline links and bold text (a and b tags) inside paragraph text
  • The generator crate can also be used standalone in a non-browser environment

Example input (JSON)

{
    "title": "Example Document",
    "contents": [{
            "obj_type": "Paragraph",
            "params": {
                "text": "Hello World!",
                "font_size": 18,
                "leading": 24,
                "align": "center",
                "font_name": "Helvetica-Bold"
            }
        }
    ]
}

How to generate an example PDF

Option 1 (with Rust)

  • First install the Rust compiler
  • Clone this repo:git clone https://github.com/jussiniinikoski/wasm-pdf.git
  • Change to directory: cd wasm-pdf
  • Install JavaScript libraries: npm install
  • Launch the local development server: npm run serve
  • Open your browser and visit the url provided by the server, usually http://localhost:8080

Option 2 (with JavaScript only / npm package)

Special Thanks

License

This project is licensed under either of

About

Generate PDF files with JavaScript and WASM (WebAssembly)

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Rust 97.2%
  • JavaScript 1.6%
  • HTML 1.2%