Skip to main content Skip to complementary content

Extension API

Information noteIf you are using Qlik Sense Business or Qlik Sense Enterprise SaaS, see the API documentation at the Qlik (Developer Portal).
Information note

If you plan on using capability APIs to build custom visualizations, mashups, or extensions, consider using the nebula.js open-source library available on NPM instead.

nebula.js is a collection of JavaScript libraries, visualizations, and CLIs that helps developers build and integrate visualizations on top of Qlik's Associative Engine. For more information, see nebula.js.

The Extension API consists of methods and properties used to create custom visualization extensions.

Getting started

To use the Extension API in visualization extensions, you can follow the simple hello world example created in Getting started building visualization extensions.

Version history

Each method and property contain information around when it was introduced, updated, deprecated or removed. A list of all relevant API changes per version release can be found in API version history.

Examples of use

Learn how to use the Extension API in your visualization extensions.

Hello world

define( [
],
function ( ) {

	return {
		paint: function ($element) {
			$element.html( "Hello world!!" );
		}
	};

} );

Initial properties

The initialProperties property specifies the properties the object should have when created.

		initialProperties : {
			qHyperCubeDef : {
				qDimensions : [],
				qMeasures : [],
				qInitialDataFetch : [{
					qWidth : 2,
					qHeight : 50
				}]
			}
		},

Select values

The selectValues method selects values in this object. It activates the Selection bar and behaves like a standard Qlik Sense selection, including a selections preview.

If you instead want the selections to be sent to Qlik associative engine right away, without selection preview and confirmation, you can call the selectValues method in the Backend API.

$element.find('li').on('click', function() {
            if(this.hasAttribute("data-value")) {
                         var value = parseInt(this.getAttribute("data-value"), 10), dim = 0;
                         self.selectValues(dim, [value], true);
            }
});

Snapshots

The snapshot property enables the ability to take snapshots of visualization extensions for use in data storytelling.

var ext = {
	support: {
		snapshot: true
	}
};

Exporting and printing

The ability to export visualization extensions to different formats is enabled with the export property. When set to true, the following export capabilities are enabled:

  • Export as an image.
  • Export to PDF.
  • Export story to PowerPoint.
  • Export story to PDF.

In addition, the ability to export data from visualization extensions is enabled with the exportData property.

var ext = {
	support: {
		snapshot: true,
		export: true,
		exportData: true
	}
};

Did this page help you?

If you find any issues with this page or its content – a typo, a missing step, or a technical error – let us know how we can improve!