The Qlik Sense Single Object Configurator

This snappily titled feature, found in the Dev Hub, actually provides a very simple way to embed Sense objects in web pages. We have just used it on one of our marketing pages. This article describes how you can use it also.

The Developers Hub

This is where you can find a number of tools to help with building extensions, widgets, mash-ups and, as I mentioned in my last post, importing QlikView apps. It is also home to the Single Object Configurator. How you navigate to it from the hub has changed about a bit from version to version, but as at now you can find it as an option on the ellipsis menu at the top right of the hub.

In all versions you can also get straight to it at https://servername/dev-hub

Our Requirement

We are sponsoring a youth cricket event, and wanted to provide a micro site for the event that showcased what Qlik Sense could do, whilst keeping it simple for non data people. Being aware of the Qlik demo featuring the T20 Indian Premier League we wanted to make use of that. Screen grabs would allow us to show part of what Sense can do, but we wanted something interactive.

The completed page that we created for the event can be viewed here:

https://www.quickintelligence.co.uk/t20

To find out how we created it; read on.

Accessing the Demo Hub and Dev Hub

As you probably know, the Qlik demo site has a custom menu for searching for and opening apps. It is just a standard Sense server under the bonnet though (with a few customisations). A cursory look at the URL shows it is using a virtual proxy called site. This means the standard hub can be found here:

https://sense-demo.qlik.com/site/hub/

This site can be useful if you are out and about and want to demo what a Sense server looks like, rather than just the functionality that you get once in an app.

Even more useful, for our purposes, though is the Qlik Dev Hub, which you can access here:

https://sense-demo.qlik.com/site/dev-hub/.

Obviously this is locked down, and you do not get all of the functionality available in a standard Enterprise Dev Hub, but the Single Object Configurator is there, and that is what we needed.

The purpose of this tool is to allow a site administrator to select any object from within a Sense site and then configure a URL to view that object either on it’s own page, or in an iframe.

Configuring Your Object

The first thing you need to do when using the Single Object Configurator is to choose which app contains the object that you want to configure. For our purposes I chose the IPL App from the drop down:

Once selected you see the Sheets in the app down the left hand side and underneath those in the tree structure the various objects. When you select an object from the menu it is placed into the main panel of the Configurator and you can start selecting options.

When the selected object is loaded you can start selecting options for that object. It is possible to lock down the chart so that it shows a specific selection and can not be interacted with. We wanted to show how charts interact with each other, and how selections could be made, so we wanted a dynamic chart with a current selections bar. First of all, under the general tab all of the options to Disable functionality were deselected.

On the Selections options part of the accordion the tick box was set to show the Current Selections bar, and I also set a default selection to pick only one Season of the IPL. If the selections were fixed this would be all the user can see, but as it is I have allowed them to deselect it or pick another.

Once configured all I had to do was to copy the iframe code from the top of the configurator and paste that into WordPress. The code generated looks like this, you can see how the options (including selection) set through the UI can be modified in the URL:

All that remained was to set the dimensions for the iframe and the chart was then present in my web page, looking a bit like this:

As I wanted to show off how multiple charts would interact when placed on the same web page I then created two more charts, this time without the selections bar on. This allowed me to write a mini-tutorial around use of Sense, right into the web page.

To demonstrate that working here also, here is another chart from the same app:

You can now see how selections in one chart reflect in the other. To see how I turned this into an interactive tutorial visit the page here.

Further Use Cases

This approach was ideal for what we wanted, as the demo is publicly available online and visible to everyone. The single configurator is also available on an on-premise Qlik Sense Enterprise server, and even in Sense Desktop (which uses a local IP and port 4848 to work in a browser). Presently it is not present in Qlik Sense Cloud.

By using this on an Enterprise server a layout of charts on a page can be created which is not bound by the grid size that is in Sense, or the lack of vertical scroll (at the time of writing). Access to the charts is still bound by the security rules set up in Sense Enterprise and the tokens that users have available, showing charts in this way does not expose any more data than would be available in the Hub. By embedding bits of Sense in an HTML additional copy can be added around the chart to provide context, if embedding in an ASP or PHP page that additional content can also be dynamic.

Obviously the better, more robust, way of building pages of this sort is with the Mashup Editor, but this requires more HTML coding knowledge and takes a bit more time. An analyst with a bit of HTML knowledge (or a GUI editor) could create a mock-up of a page they want for a developer to then build the full on mashup.

All-in-all the Single Object Configurator is another window into the ever expanding world of Qlik Sense automation and integration, which I have blogged about previously.

I hope this tutorials has given you the inspiration and knowledge to go out and do even more with the Qlik Platform.

Please feel free to comment below.