plouc / nivo

nivo provides a rich set of dataviz components, built on top of the awesome d3 and React libraries
https://nivo.rocks
MIT License
13.08k stars 1.02k forks source link

Supplying function to colorBy for custom colour broken in v0.56.0 #520

Closed stahlmanDesign closed 5 years ago

stahlmanDesign commented 5 years ago

In v0.55.0 I could provide a function for colorBy like this: colorBy: ({ id, data })=> data[`${id}_MyColourInData`] which would assign a custom colour from the data to a bar in the bar and line charts.

In 0.56.0 it seems to be ignored and assigns the Nivo colour scheme instead.

This affects Line, Bar and maybe other chart types

plouc commented 5 years ago

Yes, the API changed, now the custom coloring function can be passed to colors instead of colorBy.

plouc commented 5 years ago

I also started to move color management to a dedicated package, here is the implementation => https://github.com/plouc/nivo/blob/master/packages/colors/src/ordinalColorScale.js

plouc commented 5 years ago

colorBy can still be used to pick the property to use with the color scale from colors if it's not a custom function.

plouc commented 5 years ago

You can have a look at the SwarmPlot colors documentation on https://nivo.rocks/swarmplot

stahlmanDesign commented 5 years ago

Cool, very powerful

hanford commented 5 years ago

@plouc does the documentation need to be updated to reflect this change? I noticed this as well while updating from 52 -> 59

image
zvictor commented 2 years ago

You can have a look at the SwarmPlot colors documentation on https://nivo.rocks/swarmplot

Only a few charts support colorBy? I can't make it work with @nivo/scatterplot 🥹

I was hoping to replicate this Recharts effect in which the element changes color on hover. But I can't even change its color in static mode, let alone while hovering 😅