# Custom SI Unit Prefixes

When formatting text with SI units we get the G prefix for numbers greater than 1E9. For plots with financial or economic data we want to change the G to the more business friendly B for billions. The example below shows \$790M, \$1.1G and \$1.2G. How can we make this show \$1.1B and \$1.2B? This was discussed as a D3 issue here but I canโt figure out how to make this change within Plotly React.

``````
import React from 'react';
import Plot from 'react-plotly.js';

class App extends React.Component {
render() {
return (
<Plot
data={[
{ type: "bar", x: [1, 2, 3], y: [789000000, 1120000000, 1220000000] }
]}
layout={{
width: 320,
height: 240,
title: "A Fancy Plot",
yaxis: {
tickformat: "\$.2s", // want to show B instead of G for billions
hoverformat: "\$,.2s" // want to show B instead of G for billions
}
}}
/>
);
}
}

``````

Also interested in using B for billions. Did you find a solution?

I have revisited this problem a few times since posting this but still have not found a solution.

@mattf1216 Hereโs a solution I found by adding the following to your `yaxis`:

``````'tickprefix': '\$'
``````

or in JS:

``````tickprefix: '\$'
``````

My yaxis labels by default label large numbers as 1B, 500M, etc. so by adding the prefix, it comes out as \$1B, \$500M, etc.

I also removed `tickformat` altogether.

Let me know if that works for you as well!

@eddgr This worked โ thank you!!

That solves the problem for the axis. For annotations I did this:

``````import { format } from "d3-format";
``````
``````text: format(โ\$.2sโ)(12300000000).replace('G', 'B')
``````