▶Book Description
This book is a practical hands-on introduction to D3 (Data-driven Documents): the most popular open-source JavaScript library for creating interactive web-based data visualizations. Based entirely on open web standards, D3 provides an integrated collection of tools for efficiently binding data to graphical elements. If you have basic knowledge of HTML, CSS and JavaScript you can use D3.js to create beautiful interactive web-based data visualizations.
D3 is not a charting library. It doesn’t contain any pre-defined chart types, but can be used to create whatever visual representations of data you can imagine. The goal of this book is to introduce D3 and provide a learning path so that you obtain a solid understanding of its fundamental concepts, learn to use most of its modules and functions, and gain enough experience to create your own D3 visualizations. You will learn how to create bar, line, pie and scatter charts, trees, dendograms, treemaps, circle packs, chord/ribbon diagrams, sankey diagrams, animated network diagrams, and maps using different geographical projections. Fundamental concepts are explained in each chapter and then applied to a larger example in step-by-step tutorials, complete with full code, from hundreds of examples you can download and run.
This book covers D3 version 5 and is based on ES2015 JavaScript.
▶What You Will Learn
- Learn to use D3.js version 5 and web standards to create beautiful interactive data-driven visualizations for the web
- Bind data to DOM elements, applying different scales, color schemes and configuring smooth animated transitions for data updates
- Generate data structures and layouts for many popular chart formats
- Apply interactive behaviors to any chart
- Create thematic maps based on GIS data using different geographical projections with interactive behaviors
- Load, parse and transform data from JSON and CSV formats
▶Key Features
- Explore the latest D3.js 5 for creating charts, plots, and force-directed graphics
- Practical guide for creating interactive graphics and data-driven apps with JavaScript
- Build Real-time visualization and transition on web using SVG with D3.js
▶Who This Book Is For
The book is intended for web developers, web designers, data scientists, artists, and any developer who wish to create interactive data visualization for the Web using D3. The book assumes basic knowledge of HTML, CSs, and JavaScript.
▶What this book covers
- Chapter 1, Introduction, introduces the D3.js JavaScript library, describing its main features and concepts, and how it drives data to transform documents.
- Chapter 2, Technical Fundamentals, covers fundamental standard web technologies used by D3, such as SVG, JavaScript (ES 2015) data structures, HTML Canvas and standard data formats such as JSON and CSV.
- Chapter 3, Quick Start, includes a practical step-by-step introduction to D3.js exploring a bit of everything that will be covered later in this book. You will learn how to bind data to HTML and SVG elements and create a simple horizontal bar chart, with interactive features and animated transitions.
- Chapter 4, Data Binding, covers most of the d3-selection module and describes data-binding strategies in detail using several examples. In this chapter, you will also learn how to load and parse external data files and use the d3-dsv and d3-fetch modules.
- Chapter 5, Manipulating Data and Formatting, explores tools from six modules: d3-array, d3- collection, d3-random, d3-interpolate, d3-format and d3-time-format. You will learn how to transform data arrays, create new collections using grouping, generate random distributions, histograms, interpolate all kinds of data and format dates and numbers according to a locale.
- Chapter 6, Scales, Axes, and Colors, shows how to create and configure axes for Cartesian or radial grids (d3-axis), and scales that convert data from an input domain to an output range (d3-scale). Color schemes, interpolators, and color manipulation tools are also covered in examples that use the d3-color, d3-scale-chromatic and d3-interpolate modules.
- Chapter 7, Shape and Layout Generators, explores the generator functions from the d3-shape module used to create some classic chart types such as line, pie and stacked area charts. In this chapter, you will learn how to generate the data to render these charts in SVG or Canvas.
- Chapter 8, Animation and Interactivity, covers event handling, transitions and interactive behaviors in D3, exploring the d3-transition, d3-ease, and d3-timer modules. This chapter also explores zoom (d3-zoom), drag (d3-drag) and brush (d3-brush).
- Chapter 9, Visualizing Hierarchical Data, shows how to prepare a data set so that it can be used to represent a hierarchy, using nesting techniques and tools provided by the d3- hierarchy module to represent hierarchical data as a tree, dendogram (cluster), treemap, circle pack or partition.
- Chapter 10, Visualizing Flows and Networks, explores the visualization of network and flow diagrams. You will learn how to create a Sankey diagram (d3-sankey), a chord/ribbon diagram (d3-chord), and a force-directed animation simulation (d3-force).
- Chapter 11, Visualizing Geographical Data, explores the d3-geo module, which contains tools for operations in planar and spherical geometry. You will learn how to render interactive map visualizations using D3.js using different geographical projections.
