How To Download pdf From HTML Using Javascript

Posted By : Shivam Gupta | 15-Dec-2017

If any user want to download any document in pdf format in client side, then javascript provide such liabrary for this work. the most important liabrary for this purpose is jspdf.

Jspdf: - This liabrary convert html to pdf format in client side, there are many parameters that can be used for desired format. some of important format is given

1) - orientation: - using this parameter we can show any pdf in 'landscape' or 'portrait' mode(shortcut value will be 'p' or 'l').

2) - format: - using this parameter we can set specified format of pdf. default format for pdf is a4.

3) - unit: - using this parameter we can set unit in case of co-ordinates. units can be in 'pt', 'cm'

Installation of jspdf liabrary: -

using npm -

npm install jspdf --save

using yarn -

yarn add jspdf

Usage of jspdf plugin: -

first we create a document in html which will be print in pdf format, then we set jspdf parameter like orientation. format and size according to requirement. after then click on save button plugin will convert html document to pdf format and download it in local system.

Example: -

          // Default export is a4 paper, portrait, using milimeters for units
      var doc = new jsPDF;
      doc.text('Hello world!', 10, 10)
      doc.save('a4.pdf')

If we want to set its own paper size, orientation, or units, then we will set its own configuration -

Example: -

     // Landscape export, 2×4 inches
          var doc = new jsPDF({
          orientation: 'landscape',
          unit: 'in',
          format: [4, 2]
         })

      doc.text('Hello world!', 1, 1)
      doc.save('two-by-four.pdf')