Recharts - add commas to number on tooltip on bar chart

Gearóid picture Gearóid · Jul 17, 2018 · Viewed 9.8k times · Source

Is it possible to add a comma to large numbers on the tooltip?

for example 57,574 instead of 57574

enter image description here

Thanks!

Answer

eronisko picture eronisko · Jul 17, 2018

Yes, you can pass any formatter function to the Tooltip component, using the formatter prop e.g.

<BarChart>
  <Tooltip formatter={(value) => new Intl.NumberFormat('en').format(value)} />
</BarChart>

Check out the documentation here: http://recharts.org/en-US/api/Tooltip#formatter