Interactive Data Visualization for the Web

Preface

This is a book about programming data visualizations for nonprogrammers. If you’re an artist or graphic designer with visual skills but no prior experience working with data or code, this book is for you. If you’re a journalist or researcher with lots of data but no prior experience working with visuals or code, this book is for you, too.

This book will introduce you to D3, a JavaScript-based tool for loading data into a web page and generating visuals from that data. I assume that you have little or no programming experience. Or, perhaps you have programmed before, but D3 and data visualization are bringing you to JavaScript for the first time, and you’ve heard bad things about it. Well, JavaScript is a little weird, but it’s not as bad as you’ve heard, and everything is going to be all right. Please sit down and make yourself comfortable.

This book began as a series of tutorials posted on my website. At the time (January 2012), there wasn’t much information on D3 available that was accessible to beginners. Very quickly, I was getting hundreds, then thousands of page views a day—evidence that interest in the field generally (and D3 specifically) was growing like gangbusters. If you’ve read the tutorials, portions of the book will feel familiar, but there is a lot of new material here, including many more examples, sneaky tips, and warnings of things to avoid. Also, the book contains 78 percent more bad jokes.

Data visualization is an interdisciplinary field, which is just one reason it’s impossible to document the breadth of skills needed in a single book. Fortunately, because the field is exploding in popularity, there are many new titles to choose from, each of which complements this one.

On design process:

• Designing Data Visualizations: Intentional Communication from Data to Display by Noah Iliinsky and Julie Steele. O’Reilly Media, 2011.
• Data Visualization: A Successful Design Process by Andy Kirk. Packt Publishing, 2012.

On visual design principles and techniques:

• The Functional Art: An Introduction to Information Graphics and Visualization by Alberto Cairo. New Riders, 2012.
• Information Dashboard Design: The Effective Visual Communication of Data by Stephen Few. O’Reilly Media, 2006.

On the practicalities of working with data:

• Bad Data Handbook: Mapping the World of Data Problems by Q. Ethan McCallum. O’Reilly Media, 2012.
• Data Analysis with Open Source Tools: A Hands-On Guide for Programmers and Data Scientists by Philipp K. Janert. O’Reilly Media, 2010.
• Python for Data Analysis: Agile Tools for Real World Data by Wes McKinney. O’Reilly Media, 2012.

Conventions Used in This Book

The following typographical conventions are used in this book:

Italic

Indicates new terms, URLs, email addresses, filenames, and file extensions.

Constant width

Used for program listings, as well as within paragraphs to refer to program elements such as variable or function names, databases, data types, environment variables, statements, and keywords.

Constant width bold

Shows commands or other text that should be typed literally by the user.

Constant width italic

Shows text that should be replaced with user-supplied values or by values determined by context.

Tip

This icon signifies a tip, suggestion, or general note.

Warning

This icon indicates a warning or caution.

Using Code Examples

This book is here to help you get your job done. In general, if this book includes code examples, you may use the code in this book in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require permission.

We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: “Interactive Data Visualization for the Web by Scott Murray (O’Reilly). Copyright 2013 Scott Murray, 978-1-449-33973-9.”

If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at [e-mail].

Safari® Books Online

Note

Safari Books Online is an on-demand digital library that delivers expert content in both book and video form from the world’s leading authors in technology and business.

Technology professionals, software developers, web designers, and business and creative professionals use Safari Books Online as their primary resource for research, problem solving, learning, and certification training.

Safari Books Online offers a range of product mixes and pricing programs for organizations, government agencies, and individuals. Subscribers have access to thousands of books, training videos, and prepublication manuscripts in one fully searchable database from publishers like O’Reilly Media, Prentice Hall Professional, Addison-Wesley Professional, Microsoft Press, Sams, Que, Peachpit Press, Focal Press, Cisco Press, John Wiley & Sons, Syngress, Morgan Kaufmann, IBM Redbooks, Packt, Adobe Press, FT Press, Apress, Manning, New Riders, McGraw-Hill, Jones & Bartlett, Course Technology, and dozens more. For more information about Safari Books Online, please visit us online.

How to Contact Us

Please address comments and questions concerning this book to the publisher:

O’Reilly Media, Inc.

1005 Gravenstein Highway North

Sebastopol, CA 95472

800-998-9938 (in the United States or Canada)

707-829-0515 (international or local)

707-829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at http://oreil.ly/interactive_data_visualization_web.

To comment or ask technical questions about this book, send email to [e-mail].

For more information about our books, courses, conferences, and news, see our website at http://www.oreilly.com.

Find us on Facebook: http://facebook.com/oreilly

Follow us on Twitter: http://twitter.com/oreillymedia

Watch us on YouTube: http://www.youtube.com/oreillymedia

Acknowledgments

My name may be on the cover, but as an author, I feel as though I am merely funneling the wisdom of hundreds of other brilliant minds onto the page.

First and foremost, I must thank my wife Nora, not least for being the first to say “Hey, you should turn those tutorials into a book.” Without her support and encouragement, this project never would have happened.

Thanks also to Rosten Woo, with whom I collaborated on my first D3 project, for reaching out and giving me a reason to finally dig into this new tool. Thanks to Joe Golike for several early D3 debugging sessions around that time, and to Jen Lowe and Sha Hwang for their reviews and feedback on the initial tutorials.

I am extremely grateful to Casey Reas, Dan Shiffman, Joshua Noble, and Noah Iliinsky—not just for offering advice on the book-creation process, but also for their groundbreaking work in the spheres of art, design, code, and data. Their careers have greatly influenced my own.

In that vein, I should also thank Jan Kubasiewicz at MassArt’s Dynamic Media Institute. Back in 2007, Jan encouraged me to check out something called Processing, which eventually led me to a whole new career in code-driven arts, data visualization, and now this book.

It has been a pleasure working with my editor, Meghan Blanchette, and everyone else on the team at O’Reilly. Thanks to Meghan and her crew for shepherding this project all the way through, from concept to an actual, physical, chunk of paper with words and strange diagrams printed on it.

Special thanks to Mike Bostock, Jen Lowe, Anna Powell-Smith, and Daisy Vincent for agreeing to tech review the book and sending incredibly valuable feedback. The final product is vastly improved, thanks to their input. That said, if you find an error or confusing code example, it is because they begged me to rewrite it, and I steadfastly refused.

Mike gets an extra-special thanks for developing D3 in the first place. Without this elegant piece of software, the community of data visualization practitioners wouldn’t be quite as vibrant, enthusiastic, and standards-compliant as it is today.

Speaking of community, many other people—including Jérôme Cukier, Lynn Cherny, Jason Davies, Jeff Heer, Santiago Ortiz, Kim Rees, Moritz Stefaner, Jan Willem Tulp, and others who I have forgotten to mention—on the D3 list and in nearby orbits have also directly contributed to my thinking and process. Thank you for your support. I am lucky to get to collaborate with so many talented people.