search

veg / phylotree.js

Interactive viewer of phylogenetic trees
http://phylotree.hyphy.org
MIT License
169 stars 77 forks source link

Show collapsed clades using a traingle instead of the cloud #408

Open santule opened 2 years ago

santule commented 2 years ago

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 commented 2 years ago

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.

spond commented 2 years ago

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

santule commented 2 years ago

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.