How can we add different bar color in barChart?

[sreejithexp]

How can we add different bar Color in barChart?

[vitorverasm]

This was a quite long ago, but to change the color from all the bars in the chart you can use color, fillShadowGradient and fillShadowGradientOpacity props of the ChartConfig as described here. Example:

const chartConfig = {
  backgroundGradientFrom: '#fff',
  backgroundGradientFromOpacity: 0,
  backgroundGradientTo: '#fff',
  backgroundGradientToOpacity: 0.5,
  color: () => '#333', // THIS
  strokeWidth: 2,
  barPercentage: 0.5,
  propsForLabels: {
    fontSize: '10',
  },
  fillShadowGradient: '#FF493B', // THIS
  fillShadowGradientOpacity: 1, // THIS
};

But if you want to change the color of only one bar I don't think it's possible right now(not that I know of) 😄 .

[MoraesGil]

@sreejithexp I did it using

withCustomBarColorFromData={true} flatColor={true}

and also sending array of colors

[Aurangempire]

@sreejithexp I did it using

withCustomBarColorFromData={true} flatColor={true}

and also sending array of colors

WOOOAAAHHHHHH !!!!! It worked 🥇 👍

[khdealwis]

@sreejithexp I did it using

withCustomBarColorFromData={true} flatColor={true}

and also sending array of colors

It worked! 👍

[SethuSS]

its worked! tq

[oluwatobimaxwell]

@sreejithexp I did it using

withCustomBarColorFromData={true} flatColor={true}

and also sending array of colors

Thank you 🙌🏽