Qlik Community

Qlik Sense Enterprise Documents & Videos

Documents & videos about Qlik Sense.

Fetch Data using Backend API

ajaykakkar93
Contributor III

Fetch Data using Backend API

Hi Team,

I have a small example to share about an important topic hypercube.
Some questions like :

  1. How can we add dimension & measures
  2. How can we add Data alternative to dimension & measure
  3. How to fetch a cube
  4. What property we get

Let's see how we can achieve all these in a simple way using "Backend API",

First make a property for adding dimension & measure OR data in to our Properties.

Note :

  1. It is important to define initial property i.e. define dimension & measure
     
  2. Number of columns & number of cells to be fetched i.e. qWidth & qHeight respectively
  3. If we edit the number of column or cells, then you need to delete & add the extension again to     view  the results

Step 1 : Define initial property :

initialProperties: {
	qHyperCubeDef: {           
		qDimensions: [],
		           qMeasures: [],
		           qInitialDataFetch: [{                 
			qWidth: 10,
			                 qHeight: 1000           
		}]
	}  
},


Step 2 : Understand this properties:

  • initialProperties: Specifies the properties the object should have when created. Define either as a hypercube (qHyperCubeDef) or as a list object (qListObjectDef).
  • qHyperCubeDef : A hypercube can contain both dimensions and measures. If selections are applied to a hypercube, only the selected values are displayed.
  • qDimensions : Dimension to  be used.
  • qMeasures : Measure to be used.
  • The maximum number of cells (qWidth * qHeight) allowed in an initial data fetch is 10,000 cells. Retrieve additional data in chunks using the getData method in the Backend API.
definition: {       
	type: "items",
	       component: "accordion",
	       items: {             
		dimensions: {                 
			uses: "dimensions",
			                 min: 1             
		},
		             measures: {                 
			uses: "measures",
			                 min: 0             
		},
		             sorting: {                 
			uses: "sorting"            
		},
		            settings: {                
			uses: "settings"           
		}      
	}
},

Step 3 : Define dimension & measure

Link to get a clear example


Step 4 : Add layout option :

paint: function($element)

Add layout to the function

paint: function($element, layout)

Console Log layout to get your extension Meta Data / Basic information

paint: function($element, layout) {    
   console.log(layout);
});

Now layout will print out basic information about my extension.

Step 5 : Understand what we get in our layout :

  1. extensionMeta:{translationKey: "",icon:"table",iconChar:"g",isLibraryItem:true,visible:true, …}
  2. footnote:""
  3. qHyperCube:{qSize: {…}, qDimensionInfo: Array(6), qMeasureInfo: Array(1), qEffectiveInterColumnSortOrder: Array(7), qGrandTotalRow: Array(1), …}
  4. qInfo:{qId: "PKsJZ", qType: "HyperCubeDemo"}
  5. showDetails:false
  6. showTitles:true
  7. subtitle:""
  8. title:""
  9. version:"1.0.0"
  10. visualization:"HyperCubeDemo"
  • extensionMeta: This will have all the configuration added in QEXT file of your extension.
  • footnote: Footnote for extension
  • qHyperCube : It has all the configuration, data, dimension & measure information , Grand total for our measure etc.
  • qInfo : It has type/object name.
  • showTitles : Will enable header & subtitle for object
  • showDetails: will allows users to choose to view details such as descriptions, measures and dimensions when user right clicks on the object.
  • title : Title of object.
  • version : Version of object.
  • visualization : Name of visualization.

Inside qHyperCube:

  1. qDataPages:(4) [{…}, {…}, {…}]
  2. qDimensionInfo:(6) [{…}, {…}, {…}, {…}, {…}, {…}]
  3. qEffectiveInterColumnSortOrder:(7) [0, 6, 1, 2, 3, 4, 5]
  4. qGrandTotalRow:[{…}]
  5. qMeasureInfo:[{…}]
  6. qSize:{qcx: 7, qcy: 2478}
  • qDataPages : It has all pages that is fetched from backend using backend api.
  • qDimensionInfo : All Dimension Information.
  • qMeasureInfo : All Measure Information.
  • qEffectiveInterColumnSortOrder : Sort order of all the fields added.
  • qGrandTotalRow : Total values as per measure.
  • qSize :
    • qcx : Number of columns.
    • Qcy : Total row data.

Inside qDataPages:

qArea:{qLeft: 0, qTop: 0, qWidth: 7, qHeight: 1000}

qMatrix:(1000) [Array(7), Array(7),…]

  1. qArea :
  • qHeight : Rows.
  • qWidth : Column.
  • qTop : Where to start.
  1. qMatrix : It has the initial data set fetched as per qArea.

Inside qMatrix[0][0]:

  • qElemNumber: returns Element Number
  • qNum: returns a number or "NaN"
  • qState: returns the state of this object as "O" , "X" or "S"
  • qText: returns a string value

 

Step 6 : Valuable variables

var self = this,
	hypercube = layout.qHyperCube,
	rowcount = hypercube.qDataPages[0].qMatrix.length,
	columncount = hypercube.qDimensionInfo.length + hypercube.qMeasureInfo.length,
	column = hypercube.qSize.qcx,
	totalrows = hypercube.qSize.qcy,
	pageheight = Math.floor(10000 / column),
	numberOfPages = Math.ceil(totalrows / pageheight); 
console.log(rowcount, layout);
Make a
function which will run based on numberOfPages from calculated variable

function fetchPage(numberOfPages, row) {     
	var add = 0;     
	for (var i = 1; i <= (numberOfPages); i++) {            // Make request pages
		         
		var requestPage = [{             
			qTop: (row * i) + add,
			             qLeft: 0,
			             qWidth: columncount,
			             qHeight: Math.min(1000, totalrows - rowcount)         
		}];         
		if (i == 0) {             
			add = 1;         
		}         
		console.log(requestPage, row);    // Pass request page in getData method in Backend API
		         
		self.backendApi.getData(requestPage).then(function(dataPages) {              // update rowcount
			       
			rowcount += dataPages[0].qMatrix.length;              // if (rowcount >= hypercube.qSize.qcy) {
			              //     $element.find(".more").hide();
			              // }
			         
		});     
	} 
}

 

Attachments
Version history
Revision #:
14 of 14
Last update:
‎2019-02-23 07:03 AM
Updated by: