phylotree.js icon indicating copy to clipboard operation
phylotree.js copied to clipboard

Show collapsed clades using a traingle instead of the cloud

Open santule opened this issue 2 years ago • 3 comments

Hello,

Thank you for this amazing phylotree.js library, it allows you to customize so many things. After researching a few libraries, I settled on this one to visualize a phylogenetic tree.

I am trying to change the shape of collapsed nodes, by default it shows a steel blue cloud. But I want to show a triangle/pie and color it. I know I need to change the SVG element somehow, but I was wondering if there are some properties that would allow me to change the shape of a collapsed node?

Example below:

Screen Shot 2022-03-21 at 9 35 16 pm

Thank you for your help, Sanjana

santule avatar Mar 21 '22 11:03 santule

Has anyone tried to change the clade color based on the node annotation? I see there are clade properties you can manipulate but how to change them when calling tree. render? If anyone has done this before, your help is much appreciated.

santule avatar Mar 23 '22 00:03 santule

Dear @santule,

Collapsed clade representation via "clouds" is currently hardcoded; the original idea was to depict subtree structure which is lost by using triangles for everything. You present an interesting use case, and I am considering adding support for such features, i.e. different render options for collapsed clades, and coloring / labeling these collapsed clades. Let me tinker with the code.

Best, Sergei

spond avatar Apr 05 '22 19:04 spond

That would be awesome, we have 10,000+ sequences. The idea is for the user to know where he/she is in the tree at the same time focusing on a particular clade. So we will achieve this by collapsing all nodes with their summary except for TIER1 nodes. Thank you for your response.

santule avatar Apr 06 '22 00:04 santule