I am using a doughnut chart from chartjs, and in the center of this canvas I am filling two lines of text. These show up fine after the initial animation, but when I hover over the doughnut, a tool tip shows up for the relevant element (which is expected), but the fill text vanishes. Any reason why this might be happening and how I can rectify it ?

here is the code I am using to generate the text on the canvas 

```
var pieChart = document.getElementById("pieChart").getContext("2d");
new Chart(pieChart).Doughnut(pieData, {percentageInnerCutout : 80, animationEasing: "easeOutQuart", onAnimationComplete: function() {
        pieChart.fillStyle = 'black'
        pieChart.font = "50px Roboto";
        pieChart.textAlign = "center";
        pieChart.fillText(distributionChartData[3]+" %", 135, 120);
        pieChart.font = "20px Roboto";
        pieChart.fillText((distributionChartData[0]+distributionChartData[1]+distributionChartData[2])+" Responses", 135, 160);
    }
});

```

Here is an image of the chart after initial load[![enter image description here](https://i.stack.imgur.com/BlCI1.png)](https://i.stack.imgur.com/BlCI1.png)

this is the image after hover[![enter image description here](https://i.stack.imgur.com/X66dA.png)](https://i.stack.imgur.com/X66dA.png)