Column chart
Integration with Highcharts
HTML
<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<script src="https://cdn.flexmonster.com/lib/flexmonster.highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<div id="pivot-container"></div>
<br/>
<div id="highcharts-container"></div>
JavaScript
var pivot = new Flexmonster({
container: "#pivot-container",
componentFolder: "https://cdn.flexmonster.com/",
report: {
dataSource: {
dataSourceType: "json",
data: getData()
},
slice: {
rows: [{
uniqueName: "kpi_type"
}, {
uniqueName: "kpi"
},
{
uniqueName: "segment_name"
}],
measures: [{
uniqueName: "tg"
},
{
uniqueName: "cg"
},
{
uniqueName: "tgr"
}]
},
options: {
viewType: "grid",
configuratorActive: false
}
},
height: 450,
toolbar: false,
reportcomplete: function() {
pivot.off("reportcomplete");
createChart();
}
});
function createChart() {
pivot.highcharts.getData({
type: "column"
},
function(data) {
$('#highcharts-container').highcharts(data);
},
function(data) {
$('#highcharts-container').highcharts(data);
}
);
}
function getData() {
return [
{
"kpi_type": "INSTANT",
"kpi": "OG Voice",
"segment_name": "Call Count",
"tg": 25917,
"cg": 2319,
"tgr": 83038
},
{
"kpi_type": "INSTANT",
"kpi": "OG Voice",
"segment_name": "On net Call Count",
"tg": 26210,
"cg": 59773,
"tgr": 28724
},
{
"kpi_type": "INSTANT",
"kpi": "OG Voice",
"segment_name": "Off Net Call Count",
"tg": 69159,
"cg": 41088,
"tgr": 37391
},
{
"kpi_type": "INSTANT",
"kpi": "OG Voice",
"segment_name": "International Call Count",
"tg": 68083,
"cg": 30981,
"tgr": 38340
},
{
"kpi_type": "INSTANT",
"kpi": "OG Voice",
"segment_name": "Local Call count",
"tg": 14778,
"cg": 60512,
"tgr": 32358
},
{
"kpi_type": "INSTANT",
"kpi": "IC Voice",
"segment_name": "Call Count",
"tg": 25917,
"cg": 2319,
"tgr": 83038
},
{
"kpi_type": "INSTANT",
"kpi": "IC Voice",
"segment_name": "On net Call...