Coder Social home page Coder Social logo

p5.js-pdf's Introduction

p5.pdf

A simple PDF export module for p5.js based on browser's print to pdf function.

See the further discussion here: processing/p5.js#373

Examples (Please Use Google Chrome)

http://zenozeng.github.io/p5.js-pdf/examples/

  • Basic PDF Exporting
  • Vector PDF Exporting
  • Multiple pages using nextPage()
  • Pause and Resume
  • 4 columns * 3 rows per page and custom page size
  • Custom filename, page margin, columnGap and rowGap

Browser Compatibility

Browser Operating System Print to PDF Custom Size Custom Filename
Chrome 44 Linux Yes Yes Yes
Firefox 39 Linux Yes Not programmatically, Buggy due to bug#851937 Not programmatically
IE9 Windows Need Primo PDF Not tested Not tested
Safari OS X Not tested Not tested Not tested

FAQ

Vector Support?

You can use p5.svg. Include p5.svg and createCanvas(640, 480, SVG). Then the pdf generated will be vector.

Why not use jsPDF or pdfkit?

Seems that PDF doesn't support embed SVG difrectly. jsPDF's SVG support is buggy and very limited. I found that maybe using pdfkit is somehow better. But this library is also limited and may need a lot of work to make it work.

Since in most cases, we only need to export PDF for ourselves, so I think it is acceptable to use p5.SVG & window.print (print to pdf) to do this, since the browser's print function support vector by default and could work even the element was modified by third party library and this will avoid crashing due to creating large files in memory. BTW, browser's print support custom size (css3 @page) and filename (document.title) (test shows it works on chrome but buggy on firefox).

Links

p5.js-pdf's People

Contributors

zenozeng avatar andyinabox avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.