Ahora mismo tengo una lista de 5 círculos. Quiero que tiren hacia el centro, pero también que se aleje el uno del otro. Puedo hacer que tiren hacia el centro o se empujen uno del otro, pero no ambos. Me encantaría algo de ayuda con esto.

Algo de código fuente:

 for (var i = 0; i < socials.length; i++) { for (var j = 0; j < socials.length; j++) { if (j != i) { if (getDistance(socials[i].x, socials[i].y, socials[j].x, socials[j].y) < socials[i].radius + socials[j].radius + socialsPadding) { socials[i].accX += (socials[i].x - socials[j].x) / 100; socials[i].accY += (socials[i].y - socials[j].y) / 100; } } } socials[i].xVel = (socialRect.width/2 - socials[i].x + socials[i].accX) / 10; socials[i].yVel = (socialRect.height/2 - socials[i].y + socials[i].accY) / 10; socials[i].x += socials[i].xVel; socials[i].y += socials[i].yVel; socials[i].radius += (socials[i].destRadius - socials[i].radius) / 10; socialBubbles[i].style.width = (socials[i].radius * 2) + "px"; socialBubbles[i].style.height = (socials[i].radius * 2) + "px"; socialBubbles[i].style.transform = "translateX(" + (socials[i].x - socials[i].radius) + "px) translateY(" + (socials[i].y - socials[i].radius) + "px)"; }