-
Book Overview & Buying
-
Table Of Contents
Learn D3.js - Second Edition
By :
Brushing is an interactive technique for selecting, highlighting, or filtering a subset of data points in a visualization, in one or two dimensions. It involves drawing a continuous area around desired data points to select them, often to zoom in or highlight specific details. In a time series, a one-dimensional brush can be applied to the time axis to view data within a smaller range.
This section explains how to use brushing in D3. We start with simple examples that demonstrate the basic implementation. Run each example to see the code in action. You can then apply what you learned doing the exercises to add brushing to charts created in previous chapters.
The d3-brush module offers an area or range selection toolkit implemented in SVG. It responds to three events: 'start', 'brush' and 'end'. Calling d3.brush() with at least one event handler sets up a 2D brush behavior object. The following setup listens...