3. Scalable Vector Graphics

This chapter will serve as a primer on scalable vector graphics (SVG). It will go over how to create SVG elements and how to style them and transform them. After the basics have been covered, it will show how to build a bar chart of the global age distribution in 2010 from scratch in SVG. This chapter assumes rudimentary knowledge of HTML and CSS.

Peeking under the Hood

Toward the end of this chapter, we’re going to start building the interactive bar chart of the world’s age distribution described at the end of Chapter 2. (Only it won’t be interactive—at least not by the end of this chapter. What we’re really going to focus on is building a static version of the world’s age distribution in 2010, and 2010 only.)

Get Visual Storytelling with D3: An Introduction to Data Visualization in JavaScript™ now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.