Search code examples
d3.jsnumber-formatting

Format Y axis values, original figures in millions, only want to show first three digits

Data for my Y axis (each country) has figures in millions:

{
  date: "1960",
  germany: "72542990",
  spain: "30327000",
  france: "46621166",
  italy: "50025500"
}

How do I write the .tickFormat(d3.format("")); on my Y axis variable to format the tick values so they show up in the Y axis scale like this: 0, 20 million, 40 million, 60 million, 80 million

Currently they show up as 0, 20000000, 40000000, 60000000,80000000

Thanks.

Solution

  • Declare Formatter

    formatValue = d3.format(".2s");

    Use inside TickFormat

    .tickFormat(function(d) { return formatValue(d)});

    to replace M with million try this..

    .tickFormat(function(d) { return formatValue(d).replace('M', 'million'); });