JSFiddle - React, Tailwind, and code Playground

by Ian Sadovy

HTML

<script src="https://s3.amazonaws.com/flexmonster/2.2/flexmonster.js"></script>
<div id="pivot-content"></div>

JavaScript

var pivot = flexmonster.embedPivotComponent("https://s3.amazonaws.com/flexmonster/2.2/", "pivot-content", "100%", "600", {
  licenseKey: "Z53G-1T1WC3-1V1M-0L12-2M0A-1233-1I0Y-2Y2Q-1903-322S-0T2C-1I",
  configuratorActive: false,
  jsPivotCreationCompleteHandler: onComplete
}, true);

var dimensions = [{
  caption: "One"
}, {
  caption: "Two"
}, {
  caption: "Three"
}];

var measures = [{
  caption: "Measure One"
}];

function onComplete() {
  var flexQueryObj = {
    rows: [],
    columns: [],
    measures: []
  };
  for (var i = 0; i < dimensions.length; i++) {
    var dimension = dimensions[i];
    var name = dimension.caption;
    var dimObj = {
      uniqueName: "[" + name + "]",
      caption: name
    };
    pivot.addDimension(dimObj);
    var hierarchyObj = dimObj //angular.copy(dimObj);
    hierarchyObj.dimensionUniqueName = hierarchyObj.uniqueName;
    pivot.addHierarchy(hierarchyObj);
    flexQueryObj.rows.push({
      uniqueName: dimObj.uniqueName
    });
  }
  for (var i = 0; i < measures.length; i++) {
    var measure = measures[i];
    var measureObj = {
      uniqueName: "[Measures].[" + measure.caption + "]",
      caption: measure.caption
    };
    pivot.addMeasure(measureObj);
    flexQueryObj.measures.push({
      uniqueName: measureObj.uniqueName
    });
  }
  flexQueryObj.columns.push({uniqueName:"[Measures]"});
  pivot.runQuery(flexQueryObj);
}