jspdf-autotable example

jspdf-autotable example with trademark symbol

by jpeter06

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.2.4/jspdf.plugin.autotable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.10.2/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.10.2/umd/react-dom.production.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

<button  onclick="simplePdf()">Generar PDF</button>

CSS

.compare-good {
  background-color: #BDECB6;
  border-color: #27a4b0;
  color: green;
}


.bg-blue-light {
  background-color: #eff3f8 !important;
}

.bg-gray-light {
  background-color: #ddd !important;
}

.tableFixHead {
  overflow-y: auto;
  height: 200px;
}

JavaScript

function simplePdf(){
let doc = new jsPDF({
  orientation: 'portrait',
  unit: 'in',
  format: 'a4'
});


doc.setFontSize(14);

let totalPagesExp = "{total_pages_count_string}";


let firstColumnWidth = 1.5;


doc.text('My test page', 0.5, 0.5);
doc.addPage()
doc.autoTable( {
  head: [['ID', 'Country', 'Index', 'Capital']],
  body: [
    [1, 'Finland AA AA AA AA AA A AA AAAAAAA', 7.632, 'Helsinki'],
    [2, 'Norway AA AA AA AA AA A AA AAAAAAAAA AA AA AA AA A AA AAAAAAAAA AA AA AA AA A AA AAAAAAA', 7.594, 'Oslo'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5, 'Switzerland', 7.487, 'Bern'],
    [9, 'Sweden', 7.314, 'Stockholm'],
    [7355, 'Belarus', 5.483, 'Minsk'],
    [3, 'Denmark', 7.555, 'Copenhagen'],
    [4, 'Iceland', 7.495, 'Reykjavík'],
    [5,...