Mar 24, 2015

Center Align Microstrategy Dashboard using HTML page and iFrame

If you want to center align your dashboard in microstrategy and you are using express mode, than simple jQuery trick won't work inside an HTML container. Now, you would need some thing more. This can be done using a simple HTML page which will point to your MSTR dashboard using iFrame.

Steps:

1. Create a html file and paste the following code


<style type="text/css">
body {
overflow:hidden;
margin:0px;
}
</style>

<iframe id='db1' src="https://yourservername.com/MicroStrategy/servlet/mstrWeb;jsessionid=6EA16051877A9FDDFD626CEEB093DF20?Server=yourMSTRServerName&Project=yourProjectName&Port=0&evt=2048001&src=mstrWeb.2048001&visMode=0&currentViewMedia=1&documentID=0OP2376F412239HJ12AB8D9616930CE8"

style='height:102%;border:none;' width="100%" height="102%"></iframe>
<script>

document.addEventListener("DOMContentLoaded",init);


function init() {
var dbWidth=Number(1200);
var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],
x=w.innerWidth||e.clientWidth||g.clientWidth,
y=w.innerHeight||e.clientHeight||g.clientHeight;
elem = document.getElementById("db1");
var leftMargin=(x-dbWidth)/2;
elem.style.marginLeft = leftMargin+'px';
elem.style.width=dbWidth+"px";

}


</script>


2. Now change the iFrame src with your mstr dashboard URL
3. Change the dbWidth parameter with your dashboard width
4. Save the page and host it on a webserver

Now, browse the above published page and you should see your dashboard center aligned irrespective of MSTR view mode




2 comments: