Display of tooltip changes x position of text drawn over doughnut chart.

Using the code below I am able to draw over the center of a doughnut graph, but when tooltips are triggered the text is shifted to the left. Issue 743 got me this far and I have skimmed over the Chart.js source a few times but don’t see how I can fix this.

var canvas = document.getElementById('estimates'); var ctx = canvas.getContext('2d'); Chart.types.Doughnut.extend({ name: "DoughnutHole", initialize: function(data){ Chart.types.Doughnut.prototype.initialize.apply(this, arguments); }, draw: function(ease){ Chart.types.Doughnut.prototype.draw.apply(this, arguments); var ctx = this.chart.ctx; ctx.font = "48px serif"; ctx.fillText('Total', 95, 200); } });

var data = [ { value: 10, color:"#4E4D4A", highlight: "white", label: "Energy" }, { value: 10, color:"#4E4D4A", highlight: "white", label: "Waste Water" }, { value: 10, color: "#353432", highlight: "white", label: "Tax" }, { value: 10, color: "#94BA65", highlight: "white", label: "Water" }, { value: 10, color: "#2790B0", highlight: "white", label: "Homeowner Insurance" }, { value: 10, color: "#8FBE00", highlight: "white", label: "HOA" }, { value: 10, color: "#2B4E72", highlight: "white", label: "Other Utilities" } ];

var estimatesChart = new Chart(ctx).DoughnutHole(data, { animationEasing: "easeOutQuart",});

[MarcisB]

I was able to fix this by calling ctx.restore(); at the beginning of the function and at the end calling ctx.save();. This ensured that the initial text position is fixed and tooltips won’t change it.

Sample code: var ctx = chart.chart.ctx; ctx.restore(); ctx.font=“20px Georgia”; ctx.fillText(“Hello World!”,10,50); ctx.save();

Btw, this issue is in version 2.4 too.

[fulldecent]

Hello, today I am closing all issues that are only affecting version 1 of Chart.js as WONTFIX.

If this issue does affect version 2 as well, I apologize for the error. Please create a test case against Chart.js 2 using on of the below websites and we will be happy to reopen the issue and update its classification:

• http://jsbin.com/
• http://jsfiddle.net/
• http://codepen.io/pen/
• Premade template: http://codepen.io/pen?template=JXVYzq