Short number formatting based on CLDR locale data. Particularly useful for statistical data, showing financial numbers in charts, and abbreviating number of ratings across a range of languages.
1234
is converted to1K
in English101234
is converted to101K
in English and101.1K
if need 1 significant digit1234
is converted to1 mil
in Espanol101234
is converted to101,1 mil
in Espanol if need 1 significant digit1234
is converted to1234
in Japanese
Utilizes cldr-numbers-full. Here is the related proposal for Compact Decimal Format that this addon is based on. This is why there are no browser API's baked into something like Intl.NumberFormat
.
Lastly, this work has been built into ember-intl as of version 4.0.0-beta.6 if you also use an internationalization library. See docs for more details.
ember install ember-short-number
Provide list of language codes applicable to your app in your environment.js
file. See ISO 639-1 for more information.
If not provided, we will include the data for all CLDR number formatting options in your app. IMPORTANT - this adds ~28KB gzipped to your app so be sure to include all the languages you care about.
let ENV = {
'ember-short-number': {
locales: ['en', 'es'],
threshold: 0.05 // default
}
}
This configuration option decides when to round up the formatted number. So if you pass 95001, ember-short-number
will output 100K. However, if you pass 94999, you will get back 95K.
The following APIs take the language code as the the second argument based on ISO 639-1. You can also pass en_GB
and we will normalize it to en-GB
as well.
this.shortNumber.format(19634, 'en');
// 19K
this.shortNumber.format(19634, 'en', { significantDigits: 1, minimumFractionDigits: 1, maximumFractionDigits: 2 });
// 19.6K
this.shortNumber.format(101, 'en', { significantDigits: 1, financialFormat: true });
// 0.1M
this.shortNumber.format(19634, 'ja');
// 2万
this.shortNumber.format(19634, 'es', { significantDigits: 1 });
// 19,6 mil
- Note when using significantDigits, this addon utilizes
toLocaleString
.
"Wait, I thought this addon was for compact number formatting?" Well it can be a misnomer depending on the language. Let's look at some examples.
This doesn't seem shorter!!!! (╯°□°)╯︵ ┻━┻
this.shortNumber.format(101000, 'en', { long: true });
// 101 thousand
But this does! ʘ‿ʘ
this.shortNumber.format(101000, 'ja', { long: true });
// 101万
So we will just go with ember-short-number
for now.
Currently this only shortens with latin digits 0..9
For your information, known number systems include:
[adlm, ahom, arab, arabext, armn, armnlow, bali, beng, bhks, brah, cakm, cham, cyrl, deva, ethi, fullwide, geor, grek, greklow, gujr, guru, hanidays, hanidec, hans, hansfin, hant, hantfin, hebr, hmng, java, jpan, jpanfin, kali, khmr, knda, lana, lanatham, laoo, latn, lepc, limb, mathbold, mathdbl, mathmono, mathsanb, mathsans, mlym, modi, mong, mroo, ...]
git clone git@github.com:snewcomer/ember-short-number.git
cd ember-short-number
npm install
npm run lint:js
npm run lint:js -- --fix
ember test
– Runs the test suite on the current Ember versionember test --server
– Runs the test suite in "watch mode"ember try:each
– Runs the test suite against multiple Ember versions
ember serve
- Visit the dummy application at http://localhost:4200.
For more information on using ember-cli, visit https://ember-cli.com/.
This project is licensed under the MIT License.