JSFiddle - React, Tailwind, and code Playground

by Flexmonster Pivot Table

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<button onclick="updateData()">Update data</button>
<div id="pivot-container">The component will appear here</div>

JavaScript

var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/"
});

pivot.on('loadingolapstructure', function() {
  alert('Loading olap structure!');
});
pivot.on('olapstructureloaded', function() {
  alert('Olap structure loaded!');
});
pivot.on('olapstructureerror', function() {
  alert('Error with olap structure!');
});

function updateData() {
  pivot.updateData({
    type: 'api',
    url: 'https://olap.flexmonster.com:9500',
    index: 'fm-product-sales'
  })
}