JSFiddle - React, Tailwind, and code Playground

by abufiddle

HTML

<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<button onclick="pdf()">Export to PDF</button>
<div id="pivot-container"></div>

JavaScript

var pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 630,
  toolbar: true,
  report: getData()[0]
});

function pdf() {
alert()
  var params = {
    filename: 'flexmonster',
    header: "<div style='text-align:center;font-size:48px;font-weight:bold;'>Page Title</div>",
    footer: "<div>##PAGE-NUMBER##</div>",
    pageOrientation: 'landscape',
    pageFormat: "a1",
    destinationType: "plain"
  };
  
  flexmonster.exportTo("pdf", params);
}

function getData() {
  return [{
    "dataSource": {
      "dataSourceType": "json",
      "data": [{
          "Year": "2018",
          "Name": "Andrew",
          "City": "SubUN",
          "CP": "Two Years Prior",
          "TF": "QTD",
          "Value": 0.2287
        },
        {
          "Year": "2018",
          "Name": "Tizen",
          "City": "HZ",
          "CP": "Two Years Prior",
          "TF": "PTD",
          "Value": -0.1157
        },
        {
          "Year": "2018",
          "Name": "Andrew",
          "City": "HZ",
          "CP": "Two Years Prior",
          "TF": "YTD",
          "Value": 1.7797
        },
        {
          "Year": "2018",
          "Name": "Tizen",
          "City": "SubUN",
          "CP": "One Year Prior",
          "TF": "WTD",
          "Value": -0.0456
        },
        {
          "Year": "2018",
          "Name": "Andrew",
          "City": "HZ",
          "CP": "Two Years Prior",
          "TF": "PTD",
          "Value": -0.1155
        },
        {
          "Year": "2018",
          "Name": "Tizen",
          "City": "SubUN",
          "CP": "One Year Prior",
          "TF": "QTD",
          "Value": 0.1536
        },
        {
          "Year": "2018",
          "Name": "Andrew",
          "City": "SubUN",
          "CP": "Two Years Prior",
          "TF": "WTD",
          "Value": 0.0262
        },
        {
          "Year": "2018",
          "Name": "Tizen",
         ...