Suppose you’re making a tabbed UI where the tab to display the JSRootUI isn’t the active tab initially. A typical way to have this tab loaded & ready, but not visible, is using the CSS ‘display: none;’ style.
In JSRootPainter.js line 4944, there’s a loop that continues while a calculated value is greater than the width. Unfortunately here the element’s ‘display: none’ width is zero, and the loop will never end.
I’ll be looking into how to load the JSRootIO drawing when the tab is switched, and therefore ‘display’ is switched to ‘block’ giving the element a width. But in the meantime, is there a way to still draw the SVG for the ROOT object when display is ‘none’?
<!-- 'display: none;' is applied by the tabbing tool, in this case AngularJS UI-Boostrap -->
<div style="display: none;">
<div id="histogram-view"></div>
</div>new JSROOT.TFile('http://somewhere.com/canvas.root', function(file) {
file.ReadObject('canvas', 1, function(obj) {
JSROOT.draw('histogram-view', obj);
});
});