Формат числового значения с запятой и двумя десятичными знаками - PullRequest
0 голосов
/ 03 сентября 2018

Я использую chart.js для отображения своих продаж, проблема в том, что я не могу правильно преобразовать данные в числовой формат с запятой и двумя десятичными знаками.

Когда данные являются целым числом, вывод верен. Однако, когда я отображаю средние продажи, я получаю вывод типа

Средний объем продаж (без формата) 1000.2017
Средний объем продаж (в формате) 1 000,2017
Всего продаж (без формата) 1000
Всего продаж (в формате) 1000

Как правильно отформатировать вывод в Javascript?

tooltips: {
  callbacks: {
     label: function(tooltipItem, data) {
         var value = data.datasets[0].data[tooltipItem.index];
         value = value.toString();
         value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
              return value;
           }
       }
  },
   scales: {
     yAxes: [{
       ticks: {
         userCallback: function(value, index, values) {
           value = value.toString();
           value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
              return value;
         }
        }
    }]
}

Ответы [ 2 ]

0 голосов
/ 03 сентября 2018

Javascript предлагает вам несколько решений для этого. Первые два приходят на ум ниже.

1. number.toLocaleString

Как уже упоминалось, .toLocaleString может помочь вам, но вместо minimumFractionDigits используйте maximumFractionDigits.

Как показано ниже:

number.toLocaleString(undefined, { maximumFractionDigits: 2 })

Итак, подведем итог:

const decimalsFormated = number.toLocaleString(undefined, { maximumFractionDigits: 2 })

И чем

const finalFormated = String(decimalsFormated).replace(/\B(?=(\d{3})+(?!\d))/g, ",");

2. Number.parseFloat + toFixed

let number = 123.1234
Number.parseFloat(number).toFixed(2);

В каждом подходе оберните ваше решение в функции предпочтительно:

function getCommaSeparatedTwoDecimalsNumber(number) {
    const fixedNumber = Number.parseFloat(number).toFixed(2);
    return String(fixedNumber).replace(/\B(?=(\d{3})+(?!\d))/g, ",");

}

Вы также можете использовать регулярные выражения. Я бы сказал, что это чрезвычайно сложно.

Также очень важно отметить, что вы можете или не хотите округлять свой окончательный результат.

Использование toLocaleString с maxDigits просто удалит все после этих двух цифр. Использование toFixed будет округлять ваш вывод неправильно.

Это решение будет округлять его правильно:

Number(Math.round(1.005+'e2')+'e-2').toFixed(2);

Вставлено отсюда: Форматировать номер, чтобы всегда отображать 2 десятичных знака

Последнее, наверное, самое важное. В зависимости от формата входного номера вышеуказанное решение может работать или не работать. Вам необходимо определиться с форматом ввода и, если это не предусмотрено, предоставить форматеры для каждой возможности:

1000000,123124

10000123123

100000,1239

1,12039

1,19012

и т.д.

И в зависимости от формата порядок действий, которые вам нужно предпринять, может отличаться.

0 голосов
/ 03 сентября 2018

Вы можете попробовать использовать toLocaleString следующим образом:

value = value.toLocaleString(undefined, { maximumFractionDigits: 2 });

Он отформатирует номер в соответствии с вашей локалью с тысячами разделителей и двумя цифрами после запятой.

...