Summary pie charts
We now display pie charts using all available ES term results, but we list only the top 5 terms (.slice(0, 5)
):
Notice the many different parts of the chart!
<PieChart
component
Update <PieChart
data={
taxonomyGenusSpeciesOverview.terms.slice(0, 5).map(
(term) => ({
value: term.count,
label: term.term,
}),
)} />
- Passing data to PieChart is O.K.
- Add option to declare
maxTerms={ 8 }
(default value is5
). - Add option to set
total
(sum of all values) - Add option to set
missing
The updated PieChart should calculate the sum of other
terms (total - missing - sum_of_topX_terms
).
It should automatically add two sections to each pie:
- The
{ label: t('...other'), value: other }
- The
{ label: t('...missing'), value: missing }
A PieChart with maxTerms === 5
would potentially show the 5 top terms (using .slice(0, 5)
) plus 2 generated entries (other + missing).
Update all piecharts
We use piecharts on various pages. Add total
and missing
attributes to all.