getData

getData(options: Object, callbackHandler: Function, updateHandler: Function)

[starting from version: 2.3]

Note! This method is only for integration with 3rd party charting libraries.

The getData() method asynchronously passes the data to the callbackHandler and updateHandler functions.

The callbackHandler tracks when the data is ready to be retrieved from Flexmonster. The updateHandler tracks if the slice or number formatting was changed.

Read the tutorial to see how getData() is used for integration with any charting library.

Parameters

flexmonster.getData({
  slice: {
    rows: [
      { uniqueName: "Country" }
    ],
    columns: [
      { uniqueName: "[Measures]" }
    ],
    measures: [
      { uniqueName: "Price" }
    ],
    sorting: {
      column: {
        type: "desc",
        tuple: [],
        measure: "Price"
      }
    }
  }
},
callbackHandler,
updateHandler);

MetaObject

DataObject

ErrorObject

Example

To understand how the getData() method works, check out the example on JSFiddle. Find the detailed explanation of this example below.

Let’s assume we have the following pivot table:

The getData() method is called like this:

flexmonster.getData({},
	function(data) {
		console.log(data);
	}, 
	function(data) {
		console.log(data);
	}
);

The output looks as follows:

{
	meta: {
		caption: "",
		vAmount: 1,
		formats: [
			{
				name: "",
				thousandsSeparator: " ",
				decimalSeparator: ".",
				decimalPlaces: -1,
				maxDecimalPlaces: -1,
				maxSymbols: 20,
				currencySymbol: "",
				positiveCurrencyFormat: "$1",
				negativeCurrencyFormat: "-$1",
				negativeNumberFormat: "-1",
				nullValue: "",
				infinityValue: "Infinity",
				divideByZeroValue: "Infinity",
				textAlign: "right",
				isPercent: false,
				isCount: false,
				beautifyFloatingPoint: true
			}
		],
		v0Name: "Sum of Price",
		r0Name: "Color",
		c0Name: "Category",
		rAmount: 1,
		cAmount: 1
	},
	data: [
		{
			v0: 189610
		},
		{
			r0: "blue",
			r0_full: "color.[blue]",
			v0: 130014
		},
		{
			r0: "green",
			r0_full: "color.[green]",
			v0: 59596
		},
		{
			c0: "Accessories",
			c0_full: "category.[accessories]",
			v0: 9336
		},
		{
			c0: "Components",
			c0_full: "category.[components]",
			v0: 180274
		},
		{
			r0: "blue",
			r0_full: "color.[blue]",
			c0: "Accessories",
			c0_full: "category.[accessories]",
			v0: null
		},
		{
			r0: "blue",
			r0_full: "color.[blue]",
			c0: "Components",
			c0_full: "category.[components]",
			v0: 130014
		},
		{
			r0: "green",
			r0_full: "color.[green]",
			c0: "Accessories",
			c0_full: "category.[accessories]",
			v0: 9336
		},
		{
			r0: "green",
			r0_full: "color.[green]",
			c0: "Components",
			c0_full: "category.[components]",
			v0: 50260
		}
	] 
}

The data array in the rawData object contains all numbers shown in the pivot table including grand totals, totals, and regular cells. Depending on a visualization tool you are using, you may need data with totals and grand totals or without them.

Learn more about grand totals, totals, and regular cells below.

Grand totals

Each object representing grand totals contains only values (v0, v1, …, vN). Our example has one object representing grand totals:

{
	v0: 189610
} 

Totals

Each object representing totals contains either values (v0, v1, …, vN) and columns (c0, c1, …, cN) or values and rows (r0, r1, …, rN). Our example has the following objects representing totals:

{
	r0: "blue",
	r0_full: "color.[blue]",
	v0: 130014
},
{
	r0: "green",
	r0_full: "color.[green]",
	v0: 59596
},
{
	c0: "Accessories",
	c0_full: "category.[accessories]",
	v0: 9336
},
{
	c0: "Components",
	c0_full: "category.[components]",
	v0: 180274
}

Regular cells

Each object representing regular cells contains values (v0, v1, …, vN), columns (c0, c1, …, cN), and rows (r0, r1, …, rN). Our example has the following objects representing regular cells:

{
	r0: "blue",
	r0_full: "color.[blue]",
	c0: "Accessories",
	c0_full: "category.[accessories]",
	v0: null
},
{
	r0: "blue",
	r0_full: "color.[blue]",
	c0: "Components",
	c0_full: "category.[components]",
	v0: 130014
},
{
	r0: "green",
	r0_full: "color.[green]",
	c0: "Accessories",
	c0_full: "category.[accessories]",
	v0: 9336
},
{
	r0: "green",
	r0_full: "color.[green]",
	c0: "Components",
	c0_full: "category.[components]",
	v0: 50260
}

See an example on JSFiddle.

Read the tutorial to see how getData is used for integration with any charting library.