Chapter 3. Data-driven design and interaction
This chapter covers
- Enabling interactivity for graphical elements
- Working with color effectively
- Loading traditional HTML for use as pop-ups
- Loading external SVG icons into charts
Data visualization frameworks have existed in a form that separates them from the rest of web development. Flash or Java apps are dropped into a web page, and the only design necessary is to make sure the <div> is big enough or to take into account that it may be resized. D3 changes that, and gives you the opportunity to integrate the design of your data visualization with the design of your more traditional web elements.
You can and should style content you generate with D3 with all the same CSS settings as traditional HTML content. You can easily maintain those styles and have a consistent look and feel. This can be done by using the same style sheet classes for what you create with D3 as the ones you use with your traditional page elements when possible, and by following thoughtful use of color and interactivity with the graphics you create using D3.