Html5: llenar círculo/arco por porcentaje
-
30-10-2019 - |
Pregunta
Aquí está mi pseudo código:
var percentage = 0.781743; // no specific length
var degrees = percentage * 360.0;
var radians = degrees * Math.PI / 180.0;
var x = 50;
var y = 50;
var r = 30;
var s = 1.5 * Math.PI;
var context = canvas.getContext('2d');
context.beginPath();
context.lineWidth = 5;
context.arc(x, y, r, s, radians, false);
context.closePath();
context.stroke();
Estoy usando el JineticJS Biblioteca para controlar las formas que hago y vuelve a dibujarlas según sea necesario. Mi problema es que el código anterior no funciona en absoluto. Supongo que tengo las matemáticas incorrectas, porque si cambio radians
a algo como 4.0 * Math.PI
se dibuja todo el círculo.
He estado usando Tutorial de arco de lona HTML5 para referencia.
No hay solución correcta
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow