The format() function in D3.js is used to format the numbers in different styles available in D3. It is the alias for locale.format.
Syntax:
d3.format(specifier)(value);
Parameters: It takes the parameters given above and described below.
- specifier: It specifies the format type.
- value: It is the number to be formatted.
Return Value: It returns the Number.
Below given are a few examples of the above function.
Example1:
<!DOCTYPE html> <html lang="en">
<head> <meta charset="UTF-8">
<meta name="viewport"
content="width=device-width,
initial-scale=1.0">
<title>Document</title>
</head> <style> </style> <body> <!--Fetching from CDN of D3.js -->
<script type = "text/javascript" </script>
<script>
// It gives the floating point up to two decimals
console.log(d3.format(".2f")(42.444))
// It sets the SI-Prefix with two significant digits
console.log(d3.format(".4s")(42000))
// Currency sign i.e $
console.log(d3.format("$, ")(4200))
/* Left and right side of the number is
filled with dots and centered.*/
console.log(d3.format("^, ")(42.444))
// Localised fixed-point currency
console.log(d3.format("($.2f")(42.444))
console.log(d3.format(".^20")(42))
// Prefixed lowercase hexadecimal number
console.log(d3.format("#x")(2))
// Prefixed lowercase hexadecimal number
console.log(d3.format("#x")(42))
/* Number is grouped thousand with
two significant digits*/
console.log(d3.format(", .2r")(42124))
</script>
</body> </html> |
Output: