《小数桁数指定！》小数点以下の桁数を簡単に調整する方法

AfterEffectsのエクスプレッションで、小数を扱うときにそのまま表示するとものすごい桁数になる場合があります。

計算で桁数を整えることもできますが、簡単に桁数を指定して値を整える方法がありますので解説したいと思います。

自力で計算する場合

自力で計算する場合は、面倒な計算が必要です。

どれくらい面倒かを示すために、「decimalShaping」という関数を自分で作ってみました。結論から言うと、こんな計算はする必要はありません。

//© 2020 COLORCODE-AE
function decimalShaping(nValue, nDigit){
  var nPowDigit = Math.pow(10, nDigit);
  var nFloatValue = parseFloat(nValue);
  return Math.round(nFloatValue * nPowDigit) / nPowDigit;
}
var nPi = 3.14159265359;
decimalShaping(nPi,2); /* 結果は3.14 */

あわせて読みたい

《関数も使用可能！》自作関数を使って処理を再利用する方法

AfterEffectsのエクスプレッション内で、時間計算など、同じ処理を何度もする場合もあると思います。 そんな時は、関数を使うと記述量を大幅に減らせる可能性があります。 この関数の使い方についてご紹介します。 関数と[…]

簡単な実現方法

JavaScriptのtoFixed()を使うと簡単に実現できます。

例えば、「3.14159265359」を「3.14」にする場合は以下のように記述します。

var nPi = 3.14159265359;
nPi.toFixed(2); /* 結果は3.14 */

上記の例の場合、小数(円周率)が入った変数「nPi」に「toFixed()」メソッドで小数点以下が2桁になるよう値を整えています。

toFixed()の括弧内の値を変えれば、表示する桁数を変えられます。

例えば、「nPi.toFixed(2)」の結果は「3.14」、「pi.toFixed(3)」の結果は、「3.142」となります。

エラーが出る場合の対処方法

toFixed()でエラーが出る場合は、変換対象が文字列の可能性があります。

その場合は、以下のようにparseFloat()を使って文字列から数値（浮動小数点値）に変換すれば解決します。

var nPi = "3.14159265359";
parseFloat(nPi).toFixed(2); /* 結果は3.14 */

使用例

以下の動画の乱数の結果は全て toFixed(2) で値を整えています。

まとめ

toFixed()は本当に便利で、私は頻繁に使っています。

toFixed()を使ってエラーが出た場合は、迷わずparseFloat()で数値に変換すればほぼ解決すると思います。

簡単に使えるので是非お試しください。