Nivo: labelFormat or labelBy to access (value, id, data) similar to colorBy

[stahlmanDesign]

In a bar chart, I can colour the bars using my own calculation with colorBy. Works great (need in heatmap!)

But I constantly find I need the same power with labels https://github.com/plouc/nivo/issues/64 https://github.com/plouc/nivo/issues/146

Currently all we can access is the value:
labelFormat: value => Math.round(value) <-- I can make 5.234235 show as 5
labelFormat: value => moment.duration(value).format('HH:mm:ss', { trim: false }) <-- 10000 becomes 00:00:10

But I cannot do this (where value=150):
labelFormat: (value, id, data) => data[id+'Color'] === 'red' ? value : '' // hidden if red
labelFormat: (value, id, data) => data[id+'MyStep'] + value // Step 2A: 150
labelFormat: (value, id, data) => data[id+'AltValue'] // a label unrelated to value for calculating bar

@plouc Could a labelBy method be added to handle this (and other labels such as tooltip, axis…)
I tried to change the source code but so far have not succeeded.

[plouc]

For the tooltip, you can now customize it for the @nivo/bar components using the tooltip property which receives the current node's data.

[plouc]

@stahlmanDesign, I agree, it could be useful :)

[Larkenx]

Any progress on this? I have a pretty good use case where I have a stacked bar graph that shows the number of total "sessions" created, but some are of one type and some are another. I'd like to show the # of each type, but also show the combined total at the top of each stacked bar! This feature would allow us to do that

[sjandro]

Hi. This is the exact use-case I have. Hoping this feature comes out for the library.

[mia-pelino]

I also have this use case - I would like the combined total at the top of each stacked bar 😸

[sjandro]

I also have this use case - I would like the combined total at the top of each stacked bar 😸

@mia-pelino I actually ended up making my own implementation. I can post an example on here soon.

[sjandro]

Here is my implementation of total value label on top of nivo's stacked bars:

https://codesandbox.io/s/nivo-basic-demo-t1z56?file=/src/index.js

[mia-pelino]

@sjandro that works beautifully! thanks for sharing.

[meeow]

would also find conditional labelling useful

[stale[bot]]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!