Flexmonster - Integration with Highcharts

Demos

by Dongor7

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/2.8.13/flexmonster.js"></script>
<button onclick="setDateFilter()">
Set date filter
</button>
<div id="pivot-container"></div>

JavaScript

var pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/2.8.13/",
  licenseFilePath: "https://cdn.flexmonster.com/jsfiddle.charts.key",
  height: 300,
  toolbar: true,
  report: {
    dataSource: {
      data: getData()
    },
    slice: {
      "rows": [{
        "uniqueName": "Revenue"
      }],
      "columns": [{
        "uniqueName": "[Measures]"
      }],
      "measures": [{
          "uniqueName": "Requests",
          "aggregation": "sum"
        },
        {
          "uniqueName": "Answered Calls",
          "aggregation": "sum"
        }
      ],
      "sorting": {
        "column": {
          "type": "desc",
          "tuple": [],
          "measure": {
            "uniqueName": "Answered Calls",
            "aggregation": "sum"
          }
        }
      }
    },
    "options": {
      "showHeaders": false
    }
  },
});

function setDateFilter() {
	pivot.setFilter('Date', { query: { equal: '14/09/2021' } })
} 


function getData() {
  return [{
        'Customer Satisfaction': {
            caption: 'Customer  Satisfaction',
            type: 'string',
            uniqueName: 'Customer Satisfaction',
        },
        'Average Time to Solve An Issue': {
            caption: 'Average  Time to Solve An Issue',
            type: 'string',
            uniqueName: 'Average Time to Solve An Issue',
        },
        'Revenue': {
            caption: 'Revenue',
            type: 'number',
            uniqueName: 'Revenue',
        },
        'Support Cost': {
            caption: 'Support Cost',
            type: 'string',
            uniqueName: 'Support Cost',
        },
        'Requests': {
            caption: 'Requests',
            type: 'string',
            uniqueName: 'Requests',
        },
        'Date': {
            caption: 'Date',
            type: 'datetime',
            uniqueName: 'Date',
        },
        'Answered Calls': {
            caption: 'Answered Calls',
           ...