Display one decimal point after a whole number after divided by 10

Question

I have a slider-controlled source text which I try to sync with the corresponding graph bar. What I need is, to display one decimal point after the value of the slider is divided by 10. That is, if the slider's value is 80, I want to display the value, 8.0 on the source text. Of course I need the zero, after the 8, which is a whole number.

Answer 1

For recent versions of AE (AE 2019+)

you can use the javascript Intl.NumberFormat object, which does all the formatting for you without any tedious string munging and regex and all that carry-on.

var sliderVal = thisComp.layer("controller).effect("206")("Slider");
Intl.NumberFormat('en-AU', {minimumFractionDigits: 1, maximumFractionDigits: 1}).format(sliderVal/10)

the en-EN part is the locale string, and is your preferred locale, in other words, your culturally specific way of displaying numbers (en-AU is for Australia, and uses . for the decimal separator and , for the thousands separator). This makes it super easy to format, because it handles things like thousands separators, currency symbols and even what characters you want. You want it in Chinese decimals? Sure use 'zh-Hans-CN-u-nu-hanidec' and it will look like

一,六二九.二

The second parameter is the options, and here we get to specify things like minimumFractionDigits and maximumFractionDigits. You can also zero-pad the number with minimumIntegerDigits, so a zero-padded number with 5 digits and one decimal place would be specified thus:

Intl.NumberFormat('en-AU', {minimumIntegerDigits: 5, minimumFractionDigits: 1, maximumFractionDigits: 1}).format(theNumberToFormat); 

Read the docs here

It's worth noting that the usual suspect for number formatting someNumber.toLocaleString(), which is much simpler, doesn't work for what you want. For some reason in AE's implementation of JS it always returns two digits and adding maximumFractionDigits as an option doesn't work.

For earlier versions of AE

Here's how to get the 1 decimal place after the number:

var n = Math.round(theNumberToFormat *10)/10;
(n % 1 === 0)? '' + n + ".0": n

The first line rounds off any digits after the first decimal, the second is for when the number is an integer (when n % 1 is 0, % being the modulus operator which returns the remainder of the first number divided by the second), which would normally display with no decimal. If it is, it treats the resulting number as a string and adds '.0' to the end of it. If you want thousands separators you need to do some further trickery, that's a common JS question on SO, e.g. here.

var n = Math.round(theNumberToFormat *10)/10;
n = (n % 1 === 0)? '' + n + ".0": n
n.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

The last line is fancy regex voodo, I don't know exactly how it works, it's got something to do with lookaheads and whatnot. But it works.