Animuj okrąg wypełnienia za pomocą kanwy

Zasadniczo chcę mieć możliwość wypełnienia okręgu za pomocą kanwy, ale animuje do pewnego procentu. Mam tylko, że krąg wypełnia 80% drogi.

Moja wiedza na temat płótna nie jest niesamowita. Oto obraz, który zrobiłem w Photoshopie, aby wyświetlić to, co chcę.

Chcę, aby okrąg zaczął się pusty, a następnie wypełnij do 70% okręgu. Czy to możliwe z Canvas, jeśli tak? czy ktoś może rzucić trochę światła na to, jak to zrobić?

Oto skrzypce tego, co udało mi się zrobić

http://jsfiddle.net/6Vm67/

 var canvas = document.getElementById('Circle');
 var context = canvas.getContext('2d');
 var centerX = canvas.width / 2;
 var centerY = canvas.height / 2;
 var radius = 80;

 context.beginPath();
 context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
 context.fillStyle = '#13a8a4';
 context.fill();
 context.lineWidth = 10;
 context.strokeStyle = '#ffffff';
 context.stroke();

Każda pomoc byłaby ogromnie doceniona

questionAnswers(2)

yourAnswerToTheQuestion