D3: Formatting Tick Value. To Show B (billion) Instead Of G (giga)
I want to format Y-axis data in D3 Line chart. It's about world population so that is quite large. I am currently using below code, which is showing 'G' instead of 'B'. d3.format('
Solution 1:
If you like the formatting of SI-prefix, but not the actual prefix, just swap it out with a simple .replace
:
var f = d3.format("0.2s");
document.write(
f(1e9).replace(/G/,"B")
);
<scriptsrc="https://d3js.org/d3.v4.min.js"></script>
Solution 2:
If you want to apply Mark's Answer Globally, I used the following
fcopy = d3.format;
functionmyFormat(){
function_ret = fcopy.apply(d3, arguments)
return (function(args){returnfunction (){
return args.apply(d3, arguments).replace(/G/, "B");
}})(function_ret)
}
d3.format = myFormat;
I had the same problem with Superset, I added this in the static/dashboard file.
Solution 3:
If you don't want to override the library globally, but you want to use your "B" function around the place the same way as d3.format:
import { format } from'd3-format';
exportconstformatBillions = fs => s =>format(fs)(s).replace(/G/, "B");
Post a Comment for "D3: Formatting Tick Value. To Show B (billion) Instead Of G (giga)"