How do I localize Chartjs 3.0 tooltip

[paulhayessilex]

How in the world can you localize the values in the tooltip of Chartjs 3.0????

[LeeLenaleee]

If you want the straight answer seeing from how you formulate your question: look in the documentation.

If you want the slightly nicer explanation which you don't deserve, look at the custom callback of tooltip items and apply the right localisation there

[paulhayessilex]

Oh I've looked at the documentation

[paulhayessilex]

I've spent days looking at the documentation and at Stack overflow

[paulhayessilex]

I've raised the question in the slack charts channel too

[etimberg]

The simplest way to do this is to use the tooltip callbacks to generate a different string. Inside of that I would use Intl.NumberFormat to do the actual formatting.

const formatter = new Intl.NumberFormat('en-US');
const options = {
  plugins: {
    tooltip: {
      callbacks: {
        label: (item) => {
          // Note this code is not handling edge cases
          const value = item.dataset[item.dataIndex];
          const localeValue = formatter.format(value);
          return `${item.label}: ${localeValue}`;
        }
      }
    }
  }
}

Another option is to use the locale settings which I believe should change the tooltip too.

const options = {
  locale: 'en-US'
};