Is there a way to render an icon above each bar in BarChart?

[JosephKorel]

Is it possiblem to do something like this?

[ak-spotter]

Yes @JosephKorel
You can use the topLabelComponent property inside the data array.

Here's an example-

const topLabelIcon = () => (
  <View>
    <Icon name="arrow" />
  </View>
);
const data = [
  { value: 20, label: "M", topLabelComponent: topLabelIcon },
  { value: 30, label: "T", topLabelComponent: topLabelIcon },
  { value: 50, label: "W", topLabelComponent: topLabelIcon },
  { value: 40, label: "T", topLabelComponent: topLabelIcon },
  { value: 30, label: "F", topLabelComponent: topLabelIcon },
];

return <BarChart data={data} />;

---

You can avoid writing the topLabelComponent property repeatedly, by looping over the array-

const topLabelIcon = () => (
  <View>
    <Icon name="arrow" />
  </View>
);
const data = [
  { value: 20, label: "M"},
  { value: 30, label: "T"},
  { value: 50, label: "W"},
  { value: 40, label: "T"},
  { value: 30, label: "F"},
];

data.forEach(item=>item.topLabelComponent = topLabelIcon);

return <BarChart data={data} />;