Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Expert Data Visualization
  • Table Of Contents Toc
  • Feedback & Rating feedback
Expert Data Visualization

Expert Data Visualization

By : Jos Dirksen
close
close
Expert Data Visualization

Expert Data Visualization

By: Jos Dirksen

Overview of this book

Do you want to make sense of your data? Do you want to create interactive charts, data trees, info-graphics, geospatial charts, and maps efficiently? This book is your ideal choice to master interactive data visualization with D3.js V4. The book includes a number of extensive examples that to help you hone your skills with data visualization. Throughout nine chapters these examples will help you acquire a clear practical understanding of the various techniques, tools and functionality provided by D3.js. You will first setup your D3.JS development environment and learn the basic patterns needed to visualize your data. After that you will learn techniques to optimize different processes such as working with selections; animating data transitions; creating graps and charts, integrating external resources (static as well as streaming); visualizing information on maps; working with colors and scales; utilizing the different D3.js APIs; and much more. The book will also guide you through creating custom graphs and visualizations, and show you how to go from the raw data to beautiful visualizations. The extensive examples will include working with complex and realtime data streams, such as seismic data, geospatial data, scientific data, and more. Towards the end of the book, you will learn to add more functionality on top of D3.js by using it with other external libraries and integrating it with Ecmascript 6 and Typescript
Table of Contents (10 chapters)
close
close

What is D3?

The best description of what D3 is can be found by looking at the website: https://d3js.org/. You can find a very nice quote there that sums up pretty well what D3 does.

"D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3's emphasis on Web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation."

Looking at this quote, it is pretty clear what D3 provides. With D3 you get a set of libraries which can be used to easily create visualizations using web standards (especially SVG). This means that the visualizations created with D3 will run on all modern browsers and most of the mobile browsers.

SVG is an abbreviation of Scalable Vector Graphics. This is an XML-based format that is used to define 2D vector images. The advantage of vector images is that they can be easily scaled and transformed without losing detail (in comparison with bitmap images such as .PNG and .GIF). SVG is a W3C standard and is supported by almost all browsers on all platforms and also supports interactivity and animations. You can load SVG images directly as an image file, but also create them programmatically by manipulating the browser DOM (which is what D3 can do for us).

A big added advantage of using D3 instead of other frameworks is that it allows you to easily bind data to the elements you see on the screen (more on that later in this chapter). This allows you to create visualizations that respond to changes in the data. This approach makes creating animations, interactive elements much easier than alternative approaches. A very nice example is shown in the following figure (from http://bl.ocks.org/mbostock/4060606), which shows the unemployment rate in 2008 in the US:

You can also make more basic visualizations, such as the baby name trends in the UK:

You can make a large range of different visualizations with D3. To get a good idea of what D3 is capable of, check out the D3 gallery (https://github.com/d3/d3/wiki/Gallery), which has a large number of impressive examples.

Before we start working with D3, first some information on how this book is set up.

Visually different images
CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Expert Data Visualization
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist download Download options font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon