API calls getRowsAsync, getColumnsAsync, getReportFiltersAsync

Slice configuration

by Flexmonster Pivot Table

HTML

<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<p>
  Use the buttons below to output fields selected for rows, columns, or report
  filters. The output will appear under the component.
</p>

<button onclick="getRows()">Get rows</button>
<button onclick="getColumns()">Get columns</button>
<button onclick="getReportFilters()">Get report filters</button>

<div id="pivot-container">The component will appear here</div>

<div class="output" id="output">Output will appear here</div>

CSS

@import url(https://cdn.flexmonster.com/assets/jsfiddle-styles.css);

JavaScript

let pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 300,
  report: {
    dataSource: {
      filename: "data/data.csv"
    },
    slice: {
      reportFilters: [
      		{ uniqueName: "Country" }
        ],
        rows: [
        	{ 
          	uniqueName: "Category" ,
            filter: {
            	exclude: [
              	"category.[bikes]",
                "category.[cars]"
              ]
            }
          },
          { uniqueName: "Destination" }
        ],
        columns: [
        	{ uniqueName: "Color" },
          { uniqueName: "[Measures]" }
        ],
        measures: [
        	{ uniqueName: "Price" }
        ]
    }
  }
});

function getRows() {
  pivot.getRowsAsync().then(rows => {
  	showOutput(JSON.stringify(rows, null, 4));
  }).catch(err => {
  	console.log(err);
  });
}

function getColumns() {
  pivot.getColumnsAsync().then(columns => {
  	showOutput(JSON.stringify(columns, null, 4));
  }).catch(err => {
  	 console.log(err);
  });
}

function getReportFilters() {
  pivot.getReportFiltersAsync().then(reportFilters => {
  	showOutput(JSON.stringify(reportFilters, null, 4));
  }).catch(err => {
  	console.log(err);
  });
}

function showOutput(content) {
  document.getElementById("output").innerText = content;
}