title: Bootstrap 3 tabs & Chart.js - charts not loading on tabs
body: <p>I'm using <a href="http://getbootstrap.com/javascript/#tabs">Bootstrap 3 tabs</a> for a page layouts and <a href="http://www.chartjs.org/">Chart.js</a> to create donut graphs for a project.</p>
  
  <p>However the charts do not load when changing to a tab with a chart on it. Sometimes they load when you start inspecting elements in google chrome though.
  They only seem to render if they are loaded on the first visible tab.</p>
  
  <p>There is one known error with the chart.js javascript in the chrome console:</p>
  
  <blockquote>
    <p>Uncaught IndexSizeError: Failed to execute 'arc' on 'CanvasRenderingContext2D': The radius provided (-0.5) is negative.</p>
  </blockquote>
  
  <p>And I think this is because Bootstrap has the tabs visibility set to none and therefore the chart doesn't render properly or something...</p>
  
  <p>It should be looking like this:</p>
  
  <p><img src="https://i.stack.imgur.com/sczTO.png" alt="enter image description here"></p>
  
  <p>Has anyone else had this problem &amp; if so; is there a workaround?</p>
  
  <p>... Or should I look for another charting script that will play nicely with Bootstrap tabs.</p>
  
  <p>Thank you in advance :)</p>