Expanded Qlik Sense graph in Mashup

Thu, 18 Aug 2016 22:02:20 GMT

Hi,

I am working with mashups with Qlik Sense and I need to make available the functionality of expanding the graph as full screen and minimize it again. This functionality is available with Qlik Sense but not when you are importing the graphs into a mashup.

Could anyone support on this: how we can import the functionality into mashups? Is something that needs to be done "manually" with JS/JQuery?

Thanks,

Ramon

Re: Expanded Qlik Sense graph in Mashup

pnowicki — Fri, 19 Aug 2016 10:33:22 GMT

Ramon,

You do indeed lose this functionality in a mashup. However, you can do this with a mixture of HTML/JS/CSS, I have included relevant parts of my code and hope this helps you.

Here is my HTML:

<h3 class="panel-title"><i class="fa fa-bar-chart-o fa-fw"></i>Trend</h3>

</div>

</div>

Here is part of my JS:

$('.panel-collapse').on('click', function() {

$(this).closest('.panel').find('.panel-body').toggle();

$(this).toggleClass('is-collapsed');

});

$('.panel-fullscreen').on('click', function() {

var panel = $(this).closest('.panel');

panel.toggleClass('is-fullscreen');

$(this).toggleClass('is-fullscreen');

qlik.resize(panel.find('.qvobject').attr('id'));

});

Here is my CSS:

.panel-collapse {

border: 1px solid #999;

width: 20px;

height: 20px;

float: right;

font-size: 20px;

line-height: 18px;

}

.panel-collapse::before {

content: '-';

}

.panel-collapse.is-collapsed::before {

content: '+';

}

.panel-fullscreen {

border: 1px solid #999;

width: 20px;

height: 20px;

float: right;

font-size: 20px;

line-height: 18px;

margin-left: 10px;

font-size: 14px;

line-height: 20px;

}

.panel-fullscreen:not(.is-fullscreen) .glyphicon-resize-small {

display: none;

}

.panel-fullscreen.is-fullscreen .glyphicon-resize-full {

display: none;

}

.panel.is-fullscreen {

position: fixed;

top: 106px;

background: #fff;

z-index: 3;

right: 0;

left: 165px;

bottom: 0;

}

Re: Expanded Qlik Sense graph in Mashup

Fri, 19 Aug 2016 16:48:21 GMT

Thanks Paul. It works for me.

topic Expanded Qlik Sense graph in Mashup in Integration, Extension & APIs

Expanded Qlik Sense graph in Mashup

Re: Expanded Qlik Sense graph in Mashup

Re: Expanded Qlik Sense graph in Mashup