Accepted answer

In my case I was using ChartJs inside a bootstrap tab inside a bootstrap modal. The problem in my case was the modal, and not the tab. The code related with Chartjs has to be set into

$('#modal').on('', function (event) {
  $.getJSON(, function( data ) {
    var ctx = document.getElementById("heightChart").getContext("2d");
    window.myNewChart = new Chart(ctx).StackedBar(data,  {
      responsive : true,
      animation: true,
      showScale: true,
      multiTooltipTemplate: "<%= datasetLabel %> - <%= value %>"


I have found a hint on this other issue: Bootstrap Modal with Chart.js linechart


The panels accessed by the tabbed panes defined should have the attribute active:

  <li role="presentation" class="active col-sm-3">
    <a href="#tab3primary" data-toggle="tab">Sample</a>

<div class="tab-pane fade in active" id="tab3primary"> 
  <canvas>---displays the image here ---</canvas>

This is the loading the graph

Related Query