chart update when bootstrap tab changed

Question

I have a problem with my nvd3 graphs and bootstrap responsive tabs. Basicly I have one graph on one tab. It loads ok, but when I change tab, graph new tab has size set to 0 or something like that. I guess width on inactive tabs is set to 0 and graph has minimum width. If I change tab, graph width won't resize. So I have to update graph with onclick when tab is clicked? Or what is the best solution?
I am sorry, I could not make jsfiddle, this is my try. But I got TypeError: nv.addGraph is not a function.
This is my graph with tabs: This is when I change tabs: When I resize window, graph updates as well: After resizing window, I clicked back on Dividends Yearly. Also did not resize: How do I call update graph with simple onclick function? Something similar to WindowResize exists?

<ul class="nav nav-tabs responsive" role="tablist">
        <li role="presentation" class="active">
            <a href="#yearly" aria-controls="yearly" role="tab" data-toggle="tab"
                    onclick="nv.utils.windowResize(chart.update);">
                Dividends Yearly</a></li>
        <li role="presentation">
            <a href="#quaterly" aria-controls="#quaterly" role="tab" data-toggle="tab"
                    onclick="nv.utils.windowResize(chart.update);">
                Dividends Quarterly</a></li>
      </ul>

Answer 1

I have found same thread - bootstrap tab with nvd3 graphs in it.

$(function () {
    $(document).on('shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
        window.dispatchEvent(new Event('resize'));
    });
});