JSFiddle - React, Tailwind, and code Playground

by Flexmonster Pivot Table

HTML

<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<button onclick="displayArrows()">Display Arrows</button>
<div id="pivot-container"></div>

JavaScript

new Flexmonster({
    container: "#pivot-container",
    componentFolder: "https://cdn.flexmonster.com/",
    width: "100%",
    height: 430,
    toolbar: true,

    report: {
      dataSource: {
        filename: "data/sales.csv"
      },
      slice: {
        rows: [{
          uniqueName: "Category",
        }],
        columns: [{
            uniqueName: "Month"
          },
          {
            uniqueName: "[Measures]"
          }
        ],
        measures: [{
          uniqueName: "Revenue",
          aggregation: "sum"
        }],
      },
    }
  });

  function displayArrows() {
    flexmonster.setOptions({
      grid: {
        showHierarchies: false
      }
    });
    flexmonster.refresh();
  }