Book Image

Data Visualization with D3 and AngularJS

By : Erik Hanchett, Christoph Körner
Book Image

Data Visualization with D3 and AngularJS

By: Erik Hanchett, Christoph Körner

Overview of this book

Table of Contents (16 chapters)
Data Visualization with D3 and AngularJS
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Formatting numbers and dates


In visualizations, we will often be confronted with labeling our data properly and make the values easy to read. Floating point divisions often return ugly and long decimal numbers that do not have to be displayed with the very last position after the decimal point. When displaying time series data, we often want to customize the label captions such that they just display, for example, the current day, month, or year. You will first learn about number formats in D3.js and afterwards take a look at date and time formatting.

Specifying a number format

To create a custom number formatting function—that formats a number to a string—we use the d3.format(specifier) helper function. As an argument, we will specify the format of the output. This will return a custom function that takes the number as an argument and returns the formatted output.

The specifier has the following form:

[[fill]align][sign][symbol][0][width][,][.precision][type]

Normally, we would first define...