Por que o framerate de Raphael diminui esse código?
Então, eu estou apenas fazendo um simulador de órbita básico usando Raphael JS, onde eu desenho um círculo como a "estrela" e outro círculo como o "planeta". Parece estar funcionando bem, com o problema de que, à medida que a simulação continua, sua taxa de quadros diminui progressivamente até o movimento orbital não parecer mais fluido. Aqui está o código (nota: usa jQuery apenas para inicializar a página):
$(function() {
var paper = Raphael(document.getElementById('canvas'), 640, 480);
var star = paper.circle(320, 240, 10);
var planet = paper.circle(320, 150, 5);
var starVelocity = [0,0];
var planetVelocity = [20.42,0];
var starMass = 3.08e22;
var planetMass = 3.303e26;
var gravConstant = 1.034e-18;
function calculateOrbit() {
var accx = 0;
var accy = 0;
accx = (gravConstant * starMass * ((star.attr('cx') - planet.attr('cx')))) / (Math.pow(circleDistance(), 3));
accy = (gravConstant * starMass * ((star.attr('cy') - planet.attr('cy')))) / (Math.pow(circleDistance(), 3));
planetVelocity[0] += accx;
planetVelocity[1] += accy;
planet.animate({cx: planet.attr('cx') + planetVelocity[0], cy: planet.attr('cy') + planetVelocity[1]}, 150, calculateOrbit);
paper.circle(planet.attr('cx'), planet.attr('cy'), 1); // added to 'trace' orbit
}
function circleDistance() {
return (Math.sqrt(Math.pow(star.attr('cx') - planet.attr('cx'), 2) + Math.pow(star.attr('cy') - planet.attr('cy'), 2)));
}
calculateOrbit();
});
Parece-me que, de qualquer maneira, qualquer parte desse código faria com que a animação diminuísse gradualmente para um rastreamento; portanto, qualquer ajuda para resolver o problema será apreciada!