Calculating dynamic length for an analog clock hand in relation to the bounding box

Question

I'll try my luck here. I need to create an analog clock (for a smartwatch) where the length of one or more hands is dynamically adjusted to reach near the bounding box border. Starting point for the clock hands is not necessarily in the center of the bounding box.

I'd need to get the distance between the starting point and the end point - not just the x,y where the hand meets the bounding box border.

• Inside the bounding box top left is 0,0
• The box size can be for example 348x250
• Starting point for the clock hand can be either in the center x:174, y:125 (50%,50%) OR off center, something like x:214, y:90
• Because of the way the hands are implemented the actual length is needed - not just the x,y where the hand meets the edge

The best reference I found so far is this: Distance between center to any point on edge of rectangle in javascript

Ideally I'd have a function something like this:

function getLength(angle) {// 0-360 degrees for rotating the hand with 0° being in the top

    let boxWidth = 348;//top left is 0,0
    let boxHeight = 250;

    let clockX = 214;// center X & Y for the 'clock', also the starting point for the hand
    let clockY = 90;

    // start the magic here
    let handlength;
    ....
    // end magic here

    return handLength //return the actual max length for the hand

}

Unfortunately maths is not my forte so I idea how to calculate it. Any help? Thank You in any case if you read this far.

Answer 1

Consider the diagram below where the point $C(x;y)$ is your clock's coordinates, on a coordinate plane with width $w$ and height $h$. Consider a line from the point $C$ that represents the minutes hand of the clock at minute $t$. Find the length of the line from point $C$ to the edge of the plane. The length of the line is the hypotenuse of a right angle triangle but there are 6 sectors it can fall in.

Let $\alpha_1, \alpha_2, \alpha_3$ and $\alpha_4$, be the respective angles from the point $C$ to the vertices of the plane. Let $\alpha$ be the angle made between $0^\circ$ and the clockhand.

$$\alpha_1=\arctan{\frac{w-x}{y}}$$ $$\alpha_2=\arctan{\frac{w-x}{h-y}}$$ $$\alpha_3=\arctan{\frac{x}{h-y}}$$ $$\alpha_4=\arctan{\frac{x}{y}}$$

$$\alpha = \frac{t}{60}\times 360^\circ$$

Let $l$ be the length of the clockarm.

If $0^\circ\le\alpha\le\alpha_1$ then $$l=\frac{y}{\cos{\alpha}}$$

If $\alpha_1\le\alpha\le 90^\circ$ then $$l=\frac{w-x}{\cos{\left(90^\circ-\alpha\right)}}$$

If $90^\circ\le\alpha\le\alpha_2$ then $$l=\frac{w-x}{\cos{\left(\alpha-90^\circ\right)}}$$

If $\alpha_2\le\alpha\le 180^\circ$ then $$l=\frac{h-y}{\cos{\left(180^\circ-\alpha\right)}}$$

If $180^\circ\le\alpha\le\alpha_3$ then $$l=\frac{h-y}{\cos{\left(\alpha-180^\circ\right)}}$$

If $\alpha_3\le\alpha\le 270^\circ$ then $$l=\frac{x}{\cos{\left(270^\circ-\alpha\right)}}$$

If $270^\circ\le\alpha\le\alpha_4$ then $$l=\frac{x}{\cos{\left(\alpha-270^\circ\right)}}$$

If $\alpha_4\le\alpha\le 360^\circ$ then $$l=\frac{y}{\cos{\left(360^\circ-\alpha\right)}}$$

Sorry for using degrees and not radians - it was for explanation's sake. The functions can be simplified and therefore there could be a more elegant solution... but here is a hard fast one.