Actualmente estoy usando javascript para renderizar algunos círculos en un lienzo basado en coordenadas x & y. Me encontré con una necesidad de una ecuación matemática para calcular algunas coordenadas x e y basado en el ángulo de uno de los círculos. Básicamente tengo el círculo A y el círculo B. El círculo A se representa a una posición fija en mi lienzo con algunas coordenadas simples, es decir x = 20 and y = 20
. A continuación, utilizo las coordenadas del círculo A para renderizar el círculo B de manera que sólo toque el círculo A, como se muestra en el ejemplo A y B.
El ejemplo A sólo muestra un simple desplazamiento porque el círculo no está en ángulo, así que en el círculo B puedo simplemente establecer un desplazamiento Y de alrededor de 1,8x cualquiera que sea el valor y del círculo A para obtener el resultado deseado. En el ejemplo A, como no hay ángulo, el valor X es el mismo para los círculos A y B.
Donde me quedo atascado es cuando tengo un círculo A que está en un ángulo (el resultado deseado se muestra en el ejemplo B). Puedo poner el círculo B en el mismo ángulo sin problema para que el texto dentro de los círculos esté en el mismo ángulo. Donde estoy luchando es donde tengo que calcular el desplazamiento X e Y para el círculo B basado en los valores X e Y del círculo A.
Imagino que hay algún tipo de ecuación matemática para calcular los desplazamientos correctos de x e y cuando hay un ángulo presente, pero no tengo ni idea de cuál es.
Lo ideal es que el desplazamiento de los valores X e Y del círculo B sea tal que el círculo B siempre parezca tocar el círculo A.
¿Puede alguien indicarme la dirección correcta?