Responsive hconcat #8530
apbreports
started this conversation in
Show and tell
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Hi,
I could not find a standard way to make my hconcat charts responsive so I came up with a custom solution.
I thought I would share it in case it was of interest to the community.
I load my charts in a div:
In my javascript I get the width of this DIV with:
var BrowserWidthTemp = document.getElementById("containerChart").offsetWidth || 1000;
var BrowserWidth = BrowserWidthTemp / 10;
var BrowserHeight = (BrowserWidthTemp / 10);
I have 7 charts in my hconcat so that is why I divided it by 10. I found I needed some extra space.
Under the hconcat code I then add this. So I get a dynamic height and width of the charts based on the size of my div.
"hconcat": [{
"width": BrowserWidth,
"height": BrowserHeight,
At the end of my script I have this code to rerun the code on a browser resize.
$(window).bind('resize', function(e)
{
if (window.RT) clearTimeout(window.RT);
window.RT = setTimeout(function()
{
this.location.reload(false); /* false to get page from cache */
}, 100);
});
Let me know if you have any issues.
It works great for me.
Beta Was this translation helpful? Give feedback.
All reactions