# 3 value widget

This is probably more math then panda3d… but I’ve no idea where else to ask…

Imagine I have 3 attributes describing a character - like Speed, Defence and Damage. When a character progresses some of these attributes can change. Simple enough, right?

Here’s where it gets tricky - I want to visualize this change in the attributes using a triangle and a point. Each corner of the triangle represents a attribute and the point, or to be more precise it’s location, represents the relationship between the values of all tree attributes.

So it all starts with the point in the middle of the triangle and when one of the attributes is increased the point moves closer to the corner representing that attribute.

How would I draw this?

It’s exactly like a ‘RGB triangle’ when given R, G and B values, one needs to pinpoint a point on the triangle with that colour.

This is something like this:

Having the coordinates of T1, T2, and T3 and the values(length) of p1, p2 and p3, how do I determine the position of the P point (in T1,T2,T3 coordinate space)?

Any help is welcome, but code smiplets are more welcome that anything else

hi
i understand that u need to calculate the coordinates of the point p, if this is what you want here is the calculations

i supposed that all angles are equal
p.y=T1.y+p3
p.x=T1.x+(p2/cos(30))

if you need the coordinates to be Relative to the triangle you have to divide it by it’s length like this:

p.y=p3 / H
where H is the hight of the triangle, you can get it by : H= length(T1:T3)*cos(30)

p.x=(p2/cos(30)) / length(T1:T2)

the previus code will generate a relative coordinates, for example if the point p is near T1 the output will be near 0 and if the point p is near T2 the output P.x will be near 1.

if you don’t have the length of T1:T3 you can get H directly by this:
H= abs(T3.Y-T1.Y)

Hmm… that could work, but I was wrong about having the length of p1, p2, p3

p1, p2 and p3 are the values of my “attributes” so let’s say
p1=speed=6x
p2=defence=4x
p3=damage=2x
so in other words I only know the relative length.

another example:

I know the RGB (255, 72, 60)values, let’s say that the green corner is at point (0,0), the blue at (-1, -) and red at (1, -)
Where would I need to put my point

i want you to tell me what do you expect for the point in this situations:
all attributes are at minimum values
all attributes are at max values
all attributes have the same value
i expect from what you’ve described that the point in the two situations will be in the center, is that what you want ?

Yes.
All values start at 0, the point at that time should be at the middle, just as every time the values are the same. I can’t say what a max value would be, lets say 1000 to keep it sane but the value is not that important. 5, 15, 50 should be the same point on the triangle as 1, 3, 10 or 253, 759, 2530.

i can’t calculate the position depending on color without knowing the color gradient components

i have some calculations but I’m not sure of the Side effects , i will take your coordinates for example

where the green=speed(6x) & blue=defense(4x) & red=damage(2x )
1- we will calculate the location in the x direction first(between blue&red)

``````x=((r-b)/(r+b))*d
where r=damage,b=defense,d=distance between r&b
x=((2-4)/(2+4))*2=-0.66``````

to be continued

Isn’t is just a weighted average ?

P = (p1 T1 + p2 T2 + p3 T3) / (p1 + p2 + p3)

With a special case when p1 + p2 + p3 = 0: P = (T1 + T2 + T3) / 3.

Here, P, T1, T2 and T3 are 2D vectors, but you can decompose it along the x and y axes:

Px = (p1 T1x + p2 T2x + p3 T3x) / (p1 + p2 + p3)
Py = (p1 T1y + p2 T2y + p3 T3y) / (p1 + p2 + p3)

The stronger pn (relatively to the others), the closest P gets to Tn.

Oh, and the components of T1 T2 T3 :

T1x = 0, T1y = 0
T2x = 1, T2y = 0
T3x = 1 / 2, T3y = sqrt(3) / 2

Then you can scale and translate these coords.

nice, Niriel got your equation
good luck