Additional Guides
      Back to home
      1. Help Center
      2. Advanced Analytics
      3. Additional Guides

      Number and Date Formatting Guide

      Simple D3.js Formatting Guide for UpMetrics

      This guide will help you format numbers and dates in UpMetrics Advanced Analytics using easy-to-understand patterns.

      Quick Reference: Number Formatting

      Common Number Format Patterns

      What You Want

      Pattern to Use

      Example Result

      Regular number with 2 decimal places

      .2f

      1234.56

      Dollars with commas and 2 decimals

      $,.2f

      $1,234.56

      Percentage with 1 decimal

      .1%

      12.3%

      Percentage showing +/-

      +.1%

      +12.3%

      Large number with commas

      ,.0f

      1,234,567

      Abbreviated large number at 1 significant digit

      .1s

      1,200 = 1K

      12,000,000 = 10M

      Abbreviated large number at 2 significant digit

      .2s

      1,200 = 1.2K

      12,000,000 = 12M

      Number with parentheses if negative

      (.2f

      (123.45)

      What Each Symbol Means

      • .2 → Show 2 digits after decimal point

      • f → Fixed decimal format

      • % → Show as percentage (multiply by 100 and add % sign)

      • ` → Add dollar sign

      • , → Add thousand separators (commas)

      • + → Always show + or - sign

      • ( → Use parentheses for negative numbers

      • s → Use abbreviations (k, M, B, etc.) for large numbers

      Quick Reference: Date Formatting

      Common Date Format Patterns

      What You Want

      Pattern to Use

      Example Result

      MM/DD/YYYY

      %m/%d/%Y

      05/15/2025

      Year-Month-Day

      %Y-%m-%d

      2025-05-15

      Month Day, Year

      %B %d, %Y

      March 15, 2025

      Month Year

      %b %Y

      Mar 2025

      Abbreviated Month-Day-Year

      %b-%d-%Y

      Mar-15-2025

      Quarter Year

      Q%q %Y

      Q1 2025

      Weekday, Month Day

      %A, %B %d

      Thursday, March 15

      12-Hour Time

      %I:%M %p

      02:30 PM

      24-Hour Time

      %H:%M

      14:30
       
      What Each Symbol Means

      • %m → Month number (01-12)

      • %d → Day of month (01-31)

      • %Y → Four-digit year (2025)

      • %y → Two-digit year (25)

      • %B → Full month name (January)

      • %b → Short month name (Jan)

      • %A → Full weekday name (Monday)

      • %a → Short weekday name (Mon)

      • %H → 24-hour hour (00-23)

      • %I → 12-hour hour (01-12)

      • %M → Minutes (00-59)

      • %S → Seconds (00-59)

      • %p → AM or PM

      • %q → Quarter of year (1-4)

      Practical Examples

      For Money Values

      What You Want

      Pattern to Use

      Example Number 

      Example Result 

      Regular dollar amounts

      $,.2f

      1234.56

      $1,234.56

      Abbreviated dollar amounts (for axis labels)

      $,.2s

      1500000

      $1.5M

      Accounting style (negative in parentheses)

      ($,.2f

      -1234.56

      ($1,234.56)
       

      For Percentages

      What You Want

      Pattern to Use

      Example Number 

      Example Result 

      Basic percentage rounded to the whole

      .0%

      0.156

      16%

      Percentage with 1 decimal

      .1%

      0.156

      15.6%

      Percentage with +/- (for change metrics)

      +.1%

      -0.156

      0.156

      -0.156

      +15.6%

      -15.6%
       

       For Large Numbers

      What You Want

      Pattern to Use 

      Example Number 

      Example Result 

      With commas

      ,.0f

      1234567

      1,234,567

      Abbreviated (K, M, B, etc.)

      .2s

      1234

      1234567

      1234567890

      1.2k

      1.2M

      1.2G

      Percentage with +/- (for change metrics)

      +.1%

      -0.156

      0.156

      -0.156

      +15.6%

      -15.6%
       

      For Dates 

      What You Want

      Pattern to Use

      Example Result

      Standard date formats

      %m/%d/%Y

      %B %d, %Y

      05/15/2025

      March 15, 2025

      For axis labels

      %b %Y

      %b %d

      Mar 2025

      Mar 15

      For reports

      Q%q %Y

      Q1 2025
       

      Understanding SI Prefixes

      When using the s format, D3.js will automatically add prefixes for very large or small numbers based on the International System of Units (SI). Here's what those letters mean:

      Common Prefixes You Might See 

      Letter 

      Meaning 

      Value 

      Example 

      q

      quecto

      0.000000000000000000000000000001

      5q = 0.000...0005

      y

      yocto

      0.000000000000000000000001

      5y = 0.000...005

      z

      zepto

      0.000000000000000000001

      5z = 0.000...05

      a

      atto

      0.000000000000000001

      5a = 0.000...5

      f

      femto

      0.000000000000001

      5f = 0.000005

      p

      pico

      0.000000000001

      5p = 0.000005

      n

      nano

      0.000000001

      5n = 0.000000005

      μ

      micro

      0.000001

      5μ = 0.000005

      m

      milli

      0.001

      5m = 0.005

      (none)

      normal

      1

      5 = 5

      k

      kilo

      1,000

      5k = 5,000

      M

      mega

      1,000,000

      5M = 5,000,000

      G

      giga

      1,000,000,000

      5G = 5,000,000,000

      T

      tera

      1,000,000,000,000

      5T = 5,000,000,000,000

      P

      peta

      1,000,000,000,000,000

      5P = 5,000,000,000,000,000
       

      Why am I seeing "500m" when my value is 0.5?

      The "m" stands for "milli" or one-thousandth (0.001). So "500m" means "500 milliunits" or 0.5 units.

      Why does my axis show "1.5k" instead of "1500"?

      The "k" stands for "kilo" or thousand. So "1.5k" means "1.5 thousand" or 1,500.

      Why do my large values show as "2.3M" instead of "2,300,000"?

      The "M" stands for "mega" or million. So "2.3M" means "2.3 million" or 2,300,000.

      Additional Resources

      For more advanced formatting options, see:

      Need a custom format? Review D3.js format documentation above or contact support@upmetrics.com for help.