Single integration

You can integrate single Qlik Sense visualizations, sheets or snapshots into an iframe. You use the Single Integration API to define how the object should be integrated into your web site.

The Single configurator is a Qlik Sense tool that provides an easy way of creating simple mashup pages without having to write any code at all. It returns a Qlik Sense object, which is identified in an URL. The Qlik Sense object is typically a visualization from an app, for example a Line chart.

Note: The Single configurator creates a URL that returns a complete HTML page that contains something generic, of which an embedded visualization is an example. This URL can be embedded in a web page by including it in an iframe, for example .

Single integration examples

Note: The live code examples points to the Qlik Sense demo server and are opened in a new browser window. In case of changed app id's or object id's on the demo server, the code examples will stop working.

This section exemplifies the simplest solution of integrating sheets, visualizations and snapshots from a Qlik Sense app into iframes.

Integrating a sheet into an iframe

This example shows how to call the Performance sheet, with object id kHgmg, from the Helpdesk Management app.

Example:  

<iframe src="https://sense-demo.qlik.com/single/?appid=133dab5d-8f56-4d40-b3e0-a6b401391bde&sheet=kHgmg" frameborder="0"></iframe>

See this example in a Qlik Sense app: Integrating a sheet into an iframe

Integrating a visualization into an iframe

This example shows how to call the Open Cases by Age pie chart, with object id PAppmU, from the Helpdesk Management app located on the Qlik Demo Server.

Example:  

<iframe src="https://sense-demo.qlik.com/single/?appid=133dab5d-8f56-4d40-b3e0-a6b401391bde&obj=PAppmU" frameborder="0"/>

See this example in a Qlik Sense app: Integrating a visualization into an iframe

Defining single preselected value

This example shows how to call the Open & Resolved Cases Over Time line chart, with object id hRZaKk, from the Helpdesk Management app with the preselected Year: 2012.

Example:  

<iframe src="https://sense-demo.qlik.com/single/?appid=133dab5d-8f56-4d40-b3e0-a6b401391bde&obj=hRZaKk&select=Year,2012" frameborder="0"></iframe>

See this example in a Qlik Sense app: Defining single preselected value

Defining multiple preselected values

This example shows how to call the Open Cases vs Duration scatter chart, with object id 298bbd6d-f23d-4469-94a2-df243d680e0c, from the Helpdesk Management app with the preselected Year: 2012 and Priority: High and Medium.

Example:  

<iframe src="https://sense-demo.qlik.com/single/?appid=133dab5d-8f56-4d40-b3e0-a6b401391bde&obj=298bbd6d-f23d-4469-94a2-df243d680e0c&select=Priority,High,Medium&select=Year,2012" frameborder="0">

See this example in a Qlik Sense app: Defining multiple preselected values

Defining preselected values and bookmarks

This example shows how to call the Open Cases vs Duration scatter chart, with object id 298bbd6d-f23d-4469-94a2-df243d680e0c, from the Helpdesk Management app with the preselected Year: 2012 and Priority: High and Medium. It also includes a pre-defined bookmark, with object id hMULCFz.

Example:  

<iframe src="https://sense-demo.qlik.com/single/?appid=133dab5d-8f56-4d40-b3e0-a6b401391bde&obj=298bbd6d-f23d-4469-94a2-df243d680e0c&bookmark=hMULCFz&select=Priority,High,Medium&select=Year,2012" frameborder="0"></iframe>

See this example in a Qlik Sense app: Defining preselected values and bookmarks

Registering callbacks

You can include callbacks in your Single configurator URL.

Using test callbacks on the example above registers a callback on validation of the object as well as when the object has been rendered.

Example:  

Define the following URL. The server name is defined before the dots (...).
Note: This example includes options of selections bar and no animation, defines the identity and registers test package callbacks.

.../single/?appid=08897488-c96f-4494-86bd-14c711d550e8&obj=298bbd6d-f23d-4469-94a2-df243d680e0c&opt=currsel,noanimate&identity=xxx&callback=test

The first callback says:

onValid:298bbd6d-f23d-4469-94a2-df243d680e0c

The second callback says:

onRendered:298bbd6d-f23d-4469-94a2-df243d680e0c

Did this information help you?

Thanks for letting us know. Is there anything you'd like to tell us about this topic?

Can you tell us why it did not help you and how we can improve it?