A slider is a control that allows a user to select a value within a given interval without having to type it. It has a handle that can be displaced over a base line; the position of the handler determines the selected value. The value is then used to update other components of the page. In this section, we will create a slider with D3 using the reusable chart pattern. We will include an API to change its visual attributes and modify other elements when the slider value changes. Note that in HTML5, we can create an input
element of type range
, which will be displayed as a slider with configurable minimum and maximum steps and values. The type color
is also available, which allows us to use the native color picker. Native controls include accessibility features and using the keyboard to control the slider. More details on the input element can be found in https://developer.mozilla.org/en/docs/Web/HTML/Element/Input. To follow the examples of this section, open the...

Mastering D3.js
By :

Mastering D3.js
By:
Overview of this book
Table of Contents (19 chapters)
Mastering D3.js
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Data Visualization
Reusable Charts
Creating Visualizations without SVG
Creating a Color Picker with D3
Creating User Interface Elements
Interaction between Charts
Creating a Charting Package
Data-driven Applications
Creating a Dashboard
Creating Maps
Creating Advanced Maps
Creating a Real-time Application
Index
Customer Reviews