Add pie charts on branch.

Video tutorial

Layer data

View example tree and data

• Example data

Multiple columns of numerical data are needed. The proportional pie slices will be calculated automatically for each node.

• TSV format

Node IDs    component 1    component 2    component 3
EF151805    6    4    2
AY699794    6    9    6
AJ608641    5    6    5
JF937440    4    0    4
AJ744861    5    6    0
AJ564643    3    2    0
FN393747    7    4    6
AJ717393    2    0    6
MK238778    6    6    0
AJ575266    5    1    7
MT758060    5    2    0
MT760162    1    0    9
NR_025743    9    0    7
FM883672    9    3    2
HE985070    0    7    0
FR687202    4    0    5
KT253329    9    2    0
HQ326178    4    6    9
MT759893    8    6    6
KF309029    2    3    2
FM991866    3    7    1
MH197303    5    0    6
FR681897    1    6    0
MW309385    4    8    6
DQ112660    5    2    1
AJ575263    8    8    1
MK096443    3    4    2

Layer controlling attributes

pie

• Color set

1 color: Click this button to choose a default color set.

• Custom color
  

1 switch: Whether to use custom color set.

All names of selected columns will be listed below followed by a color selector respectively. Click each color selector to select a color you like.

• Pie style
  

1 position-type:

• start: at the start of branch
• middle: in the middle of branch
• end: at the end of branch

2 x-offset: Horizontal position offset of pies.

3 y-offset: Vertical position offset of pies.

4 innerRadius: Inner radius of each pie.

5 outerRadius: Outer radius of each pie.

6 fill-opacity: Svg path attribute.

7 stroke: Svg path attribute.

8 stroke-width: Svg path attribute.

9 stroke-opacity: Svg path attribute.

legend

See category arc legend

Tip

Each pie element can be dragged by mouse to a new position.