title: Print pie chart in chartjs
body: <p>I am having a problem with chartjs. I just
  want to print what is inside <code>div#browser</code> with a pie chart. The chart
  was fine and animated but the problem is during I print it the pie
  chart disappears but when I refresh again it it was just fine.  The
  other charts works fine in printing except the pie chart. I believe
  its reason is in the animation or something</p>
  
  <p>The chartjs script</p>
  
  <pre><code>&lt;script&gt;
      var pieChartCanvas = $("#pieChart").get(0).getContext("2d");
        var pieChart = new Chart(pieChartCanvas);
        var PieData = [
          {
            value: 700,
            color: "#f56954",
            highlight: "
  
          #f56954",
                label: "Chrome"
              },
              {
                value: 500,
                color: "#00a65a",
                highlight: "#00a65a",
                label: "IE"
              },
              {
                value: 400,
                color: "#f39c12",
                highlight: "#f39c12",
                label: "FireFox"
              },
              {
                value: 600,
                color: "#00c0ef",
                highlight: "#00c0ef",
                label: "Safari"
              },
              {
                value: 300,
                color: "#3c8dbc",
                highlight: "#3c8dbc",
                label: "Opera"
              },
              {
                value: 100,
                color: "#d2d6de",
                highlight: "#d2d6de",
                label: "Navigator"
              }
            ];
            var pieOptions = {
              //Boolean - Whether we should show a stroke on each segment
              segmentShowStroke: true,
              //String - The colour of each segment stroke
              segmentStrokeColor: "#fff",
              //Number - The width of each segment stroke
              segmentStrokeWidth: 1,
              //Number - The percentage of the chart that we cut out of the middle
              percentageInnerCutout: 50, // This is 0 for Pie charts
              //Number - Amount of animation steps
              animationSteps: 100,
              //String - Animation easing effect
              animationEasing: "easeOutBounce",
              //Boolean - Whether we animate the rotation of the Doughnut
              animateRotate: true,
              //Boolean - Whether we animate scaling the Doughnut from the centre
              animateScale: false,
              //Boolean - whether to make the chart responsive to window resizing
              responsive: true,
              // Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
              maintainAspectRatio: false,
              //String - A legend template
              legendTemplate: "&lt;ul class=\"&lt;%=name.toLowerCase()%&gt;-legend\"&gt;&lt;% for (var i=0; i&lt;segments.length; i++){%&gt;&lt;li&gt;&lt;span style=\"background-color:&lt;%=segments[i].fillColor%&gt;\"&gt;&lt;/span&gt;&lt;%if(segments[i].label){%&gt;&lt;%=segments[i].label%&gt;&lt;%}%&gt;&lt;/li&gt;&lt;%}%&gt;&lt;/ul&gt;",
              //String - A tooltip template
              tooltipTemplate: "&lt;%=value %&gt; &lt;%=label%&gt; users"
            };
            //Create pie or douhnut chart
            // You can switch between pie and douhnut using the method below.
            pieChart.Doughnut(PieData, pieOptions);
      &lt;/script&gt;
  </code></pre>
  
  <p>The html</p>
  
  <pre><code>&lt;div id="browser"&gt;
   &lt;h3 class="box-title"&gt;Browser Usage&lt;/h3&gt;
     &lt;a onclick="printContent('browser')"&gt;Print&lt;/a&gt;
     &lt;div class="chart-responsive"&gt;
       &lt;canvas id="pieChart" height="150"&gt;&lt;/canvas&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Print script</p>
  
  <pre><code>&lt;script&gt;
  function printContent(el){
    var restorepage = document.body.innerHTML;
    var printcontent = document.getElementById(el).innerHTML;
    document.body.innerHTML = printcontent;
    window.print();
    document.body.innerHTML = restorepage;
  }
  &lt;/script&gt;
  </code></pre>