jspdf-autogenerator v1.0.2

jspdf-autogenerator

NPM - Package - For Downloading PDF (Vue JS) Dependency - JSPDF and JSPDF AutoTable

Installing through CLI

npm i jspdf-autogenerator

Importing package in the project file

import JspdfAutogenerator from 'jspdf-autogenerator'

Registering the package under component

components: {
   JspdfAutogenerator,
 }

Calling the Components in the template

<template>
  <div>
    <jspdf-autogenerator/>
  </div>
</template>

Output - Basic PDF

Properties

'generatedXCordinate', 'generatedYCordinate'

Line Space

• Default value set to be as 3

• Property Name = generatedPdfLineSpace For Adding Customize Value Add following code

  <jspdf-autogenerator 
  :generatedPdfLineSpace="4"/>

  Section Space

• Default Value set to be as 5

• Property Name = generatedSectionSpace For Adding Customize Value Add following code

  <jspdf-autogenerator 
    :generatedSectionSpace="10"/>

  Starting Point (X and Y Cordinate)

• Default Value for X-Cordinate = 15

• Default Value for Y-Cordinate = 20
• Property Name for X-Cordinate = generatedXCordinate

• Property Name for Y-Cordinate = generatedYCordinate

  For Adding Customize Value Add following code

  <jspdf-autogenerator 
    :generatedXCordinate="10"
    :generatedYCordinate="30"/>

Paragraph

para2: {
      type: "paragraph",
      paraData: "Please Enter the paragraph details and it will display the data in the form of paragraph.",
      paraStyle: {
      color: 'red',
      textSize: 20,
    }
    }
    

• Property Name = generatedPdfData
• type = "paragraph" (Keyword for writing paragraph in PDF)
• paraData = Here goes the content of the paragraph. A paragraph should be of minimum one line

• paraStyle = where we can set the style of the paragraph like Color, textSize(Font Size) for that particular paragraph

  Header

   header1: {type: "header",
      mainHeading:"This is Main Heading",
      subHeading: "This is sub heading",
      horizontalMargin: true,
      mainHeadingFontSize: 15,
      subHeadingFontSize: 10,
      headingStyle: {align: 'center'},
      headerOnEachPage: true
      }

  Header Mainly Contain two heading in this current version i.e Heading and Sub Heading

• Property Name = generatedPdfheader

• mainHeading = "Main Heading Title goes Here"
• subHeading = "Sub Heading Title Goes Here"
• horizontalMargin = Set this property to true if user wants to draw the line after adding header
• mainHeadingFontSize = set this property if you want to customize main Heading size
• subHeadingFontSize = set this property if you want to customize sub heading font size -headerOnEachPage = set this flag to true if you want to add headers on each page

• headerStyle = Use this property to align the text various options available are center left right justify

  Footer

  footer:{
        addFooter: true,
        addPageRight: true,
        addTextLeft: "Footer Extra Text (Eg-Document Name) goes here",
        footerTextSize: 8
      }

  
  - Property Name = **generatedPdffooter**
  - addFooter = set this flag to true if user wants to display footer
  - footerTextSize = user can customize the size of the footer data
  - addPageRight = this property set true if user wants to add page number at the right of the page
  - addPageLeft = this property set true if user wants to add page number at the left of the page
  - addTextLeft = Random Text can be added (eg: Document Name) at the left of the page.
  - addTextRight= Random Text can be added (eg: Document Name) at the right of the page.