Search code examples
javascriptd3.jsdimple.js

How to display one million in dimple measure axis as 1000k instead of 1m?


We are displaying price value in y axis for a chart using dimpleJs. When the price more than 1 million, its automatically converted to 1m while displaying in the chart. I would like the millions to be displayed in terms of thousands or lakhs / hundreds of thousands, see Indian Numbering System. How to do it? I have searched and tried this answer but it doesn't seem to work. Below is my code snippet:

const yAxis = chart.addMeasureAxis('y', 'total');
yAxis.tickFormat = function(d) {
  let result = d;
  if ((d / 1000) >= 1) {
    result = d / 1000 + 'K';
  }
  return result;
};

Solution

  • Take a look at johnkiernander's answer on this thread: https://github.com/ramnathv/rCharts/issues/421

    Dimple just passes a string to d3.js's format function, so you can't pass a function to tickformat, you should be able to override the _getformat function like this:

      yAxis._getFormat = function() {
        return function(d) {
          let result = d;
          if ((d / 1000) >= 1) {
            result = d / 1000 + 'K';
          }
          return result;
        };
      };