Basicamente eu quero ser capaz de preencher um círculo usando canvas, mas animar para uma certa porcentagem. Ou seja, apenas o círculo preenche 80% do caminho.

Meu conhecimento de tela não é incrível, aqui está uma imagem que eu fiz no photoshop para exibir o que eu quero.

Eu quero que o círculo comece vazio e, em seguida, preencha para dizer 70% do círculo. Isso é possível com o Canvas, em caso afirmativo? Alguém pode lançar alguma luz sobre como fazer isso?

Aqui está um violino do que eu consegui

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();

Qualquer ajuda será extremamente apreciada