<linechart> in custom elements results in Error: Invalid negative value for <rect> attribute height=x #440
Labels
Comments
|
Ok, the one with <uib-tabset>
<uib-tab heading="STATS">
<div style="height: 150px;">
<linechart style="height: 150px;" data="app.getCurrentJobStats().loss" options="app.chartOptions"></linechart>
</div>
</uib-tab>
</uib-tabset>Anyone an idea? |
|
I got it a bit more working in the form that it is displaying at least the line-chart even though the error still is shown in the console. To get it displayed I put a little directive inside my app which hooks into 'uib-tab' and triggers windows.resize event when the tab gets visible: .directive('uibTab', () => {
return {
link: function(scope, element, attributes) {
scope.$watch(() => {
return !!element[0].offsetParent;
}, () => {
angular.element(window).triggerHandler('resize'); //redraw line-chart
});
}
}
})But still, there are nasty error in the console :) |
|
Since Angular-Bootstrap's tab-system is using |
|
I worked around with this issue by using a own tab system which uses |
|
hey @chaosmail, unfortunately not. I had to switch back to tab system that uses I still believe that it's a good idea to stop rendering when there's no parentElement detected or the size is 0px/0px, so this errors won't appear. |
|
@chaosmail can you give me a hint where I can start fixing this? I'd like to contribute it. |
|
Hi @marcj |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
If I use following html snipped in my application at a very high DOM level (near to body)
then everything works just fine. If I wrap that snipped above with Bootstrap's tab-system (where ng-if's and custom elements are involved) I'm getting following error:
I guess it has something todo with the Bootstrap code, because in my regular ng-if layouting stuff this doesn't happen (meaning that if my app starts without initially displaying the linechart because another div is currently in the DOM this effect doesn't happen). I tried a bit around with it and and figured out it has something todo with custom elements.
If I do this:
then this will trigger the same errors as above. I haven't yet figured out a way to workaround this. Tried with registering
dummy-elementusingdocument.registerElementbut that didn't help.The text was updated successfully, but these errors were encountered: