0

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.

enter image description here

0

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.

  • I'm using Ae 2015 version – user152435 Nov 12 at 5:52
  • Have you tried it? There were a lot of undocumented goodies in earlier versions, you never know… – stib Nov 12 at 6:13
  • Sorry I'm very new to slider expressions, could you please tell me, that how I use that second line with that thisComp.layer things? – user152435 Nov 12 at 7:16
  • Ps. Ah I got the result...!! thank you dude!! – user152435 Nov 12 at 7:17
  • Replace theNumberToFormat with the number you want to format. So if you use the first line of the other expression, it would be n – stib Nov 12 at 17:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.