Visualization of donor recipient is unclear

[cmaes]

I have a hard time figuring out what the nodes represent. Is the fill the donor? Is the stroke the recipient? It's quite difficult for me to tell what a node represents. That is, what is the difference between a purple orange circle and a purple red circle?

[EmilienDupont]

I agree. I've tried to change the design to make this more clear now. Each node now has a "D" (for donor) and an "R" (for recipient) inside it. The color of the "D" represents the type of the donor, the color of the "R" represents the type of the recipient. I feel this makes it more clear. For example, when you create cycles you can see that the donor color in a node is the same as the recipient color of the subsequent node in the cycle.

[EmilienDupont]

New visualization is clearer but nodes becomes slower...

[EmilienDupont]

(accidentally closed issue before)

[cmaes]

This is a lot easier to understand! Is there a way to split the circle in half, and fill the left half with the donor color, and right half with the recipient color? If so that might make this even clearer. Right now with just the letters 'D' and 'R' colored, I find it hard to see the color.

I also wonder, if it would help to color the edge from a donor to a recipient with the donor's color.

[EmilienDupont]

I tried to do circle splitting as well. It looked pretty good, but it was slow, just like adding the letters 'D' and 'R' was slow. A slow app doesn't look too good, so I went back to the stroke/fill idea, but made it better. Now the stroke color represents the donor, and the edge color represents the type of kidney donated. Since the stroke and the edge color coincide, this becomes a lot clearer. See e.g.

Here, the green donor gives a kidney to the green recipient. The green recipients partner gives its red kidney to the red recipient and so on.

[EmilienDupont]

(Note that the recipient isn't green in the example above, but green and orange are compatible donor/recipients)