Undefined issue
Other
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="getData()">Print</button>
<div id="pivot-container">The component will appear here</div>
<div class="output" id="output"></div>
CSS
.output {
width: 80%;
height: 300px;
margin-left: auto;
margin-right: auto;
padding: 20px;
background: rgba(242, 242, 242, 1);
font-family: Menlo, Monaco, "Courier New", Courier, monospace;
white-space: pre;
font-size: 16px;
font-weight: 400;
overflow-y: scroll;
margin-top: 20px;
}
JavaScript
let pivot = new Flexmonster({
container: "pivot-container",
componentFolder: "https://cdn.flexmonster.com/",
licenseFilePath: "https://cdn.flexmonster.com/jsfiddle.charts.key",
toolbar: true,
height: 260,
report: {
"dataSource": {
"type": "json",
"data": [
{
"day": "Tue",
"days": 1,
"city": "A",
"sales": 100
},
{
"day": "Sun",
"city": "B",
"days": 2,
"sales": 200
},
{
"day": "Wed",
"city": "C",
"days": 3,
"sales": 300
},
{
"day": "Sat",
"city": "D",
"days": 4,
"sales": 400
},
{
"day": "Mon",
"city": "E",
"days": 5,
"sales": 500
},
{
"day": "Fri",
"city": "F",
"days": 6,
"sales": 600
},
{
"day": "Thu",
"days": 7,
"city": "G",
"sales": 800
}
],
"mapping": {
"day": {
"type": "string",
"caption": "Day"
},
"city": {
"type": "string",
"caption": "City"
},
"sales": {
"type": "number",
"caption": "Sales"
},
"days": {
"type": "number",
"caption": "Days"
}
}
},
"slice": {
"expands": { "expandAll": true },
"columns": [
{
"uniqueName": "[Measures]"
},
{
"uniqueName": "day",
"sortOrder": [
"mon",
"tue",
"wed",
"thu",
"fri",
"sat",
"sun"
]
},
{
"uniqueName": "days"
},
{
"uniqueName": "city"
}
],
"measures": [
{
"uniqueName": "sales",
"aggregation": "sum",
"format": "sales"
}
]
},
"options": {
"grid": {
"type": "classic"
}
},
"formats": [
{
"name": "sales",
...