Packt+ | Advance your knowledge in tech

Explore Products

Best Sellers

New Releases

Books

Videos

Audiobooks

Free Learning

Mastering SVG

You're reading from Mastering SVG Ace web animations, visualizations, and vector graphics with HTML, CSS, and JavaScript

Product type Paperback

Published in Sep 2018

Publisher Packt

ISBN-13 9781788626743

Length 312 pages

Edition 1st Edition

Languages

CSS

Tools

SVG

Concepts

Graphics Programming

Author (1):

Rob Larsen

View More author details

Table of Contents (13) Chapters

Preface

1. Introducing Scalable Vector Graphics

2. Getting Started with Authoring SVG FREE CHAPTER

3. Digging Deeper with SVG Authoring

4. Using SVG in HTML

5. Working with SVG and CSS

6. JavaScript and SVG

7. Common JavaScript Libraries and SVG

8. SVG Animation and Visualizations

9. Helper Libraries Snap.svg and SVG.js

10. Working with D3.js

11. Tools to Optimize Your SVG

12. Other Books You May Enjoy

Leave a review - let other readers know what you think

Implementing a donut chart with D3

This next sample illustrates another basic data visualization: in this case, a donut chart. Slightly more complicated than a pie chart, this visualization illustrates some new features of D3. When complete, the visualization will look like the following screenshot.

It represents the distribution of individual comic books (referenced by title and issue number) among the top 50 comic book sales of all time (public sales, at the time of writing). There are a few comics that dominate lists like that and this chart will show which ones dominate the most:

The data looks like the following CSV:

title,numbers
"Action Comics #1",18
"All Star #8", 1
"Amazing Fantasy #15",4
"Batman #1",2
"Captain America Comics #1", 1
"Detective Comics #27",13
"Flash Comics #1", 2
"Incredible Hulk #1", 2
"Marvel Comics #1", 1
"Sensation Comics #1", 1
"Tales of Suspense #39", 1
"X-Men #1", 3

The HTML file is very simple. It includes, once again, Raleway, Bootstrap, d3-fetch, and...

The rest of the chapter is locked

Register for a free Packt account to unlock a world of extra content!

A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.

Unlock this book and the full library FREE for 7 days

Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of

Start free trial

Renews at $19.99/month. Cancel anytime

Authors (1)

Rob Larsen

Rob Larsen

Rob Larsen is an experienced frontend engineer, team lead, and manager. He is an active writer and speaker on web technology with a special focus on the continuing evolution of HTML, CSS, and JavaScript. He is a co-author of Professional jQuery, the author of Beginning HTML and CSS, and the author of The Uncertain Web. He's also an active member of the open source community as a maintainer of several popular projects

See other products by Rob Larsen

Other recommended products

Related to this chapter

Ripple Quick Start Guide

Ripple Quick Start Guide

Ripple uses blockchain technology to make international money transfer fast and efficient. Since it drastically reduces cost, it is widely accepted by financial institutions around the world. This book will help you with both theoretical and practical knowledge on how you can use the ripple technology. Since this book takes a hands-on approach, it stands out from other books which stick to theory.

Dec 2018 5h 20m

D3.js Quick Start Guide

D3.js Quick Start Guide

D3.js is a JavaScript library that allows you to create graphs and data visualizations in the browser, with HTML, SVG, and CSS. This book will take you from the basics of D3.js, so that you can create your own interactive visualizations, to creating the most common graphs that you will encounter as a developer, scientist, statistician, or data scientist.

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Responsive Web Design with HTML5 and CSS

Responsive Web Design with HTML5 and CSS

This book addresses the challenges you face in making your websites responsive across all screen sizes, and trains you to resolve each of those obstacles by efficiently implementing the latest tools in HTML and CSS.

Apr 2020 13h 36m

Personalised recommendations for you

Based on your interests and search pattern

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Realizing 3D Animation in Blender

Realizing 3D Animation in Blender

Learn Blender and animation at the same time! With clearly explained exercises, insightful commentary, and a focus on animation, this book has everything you need to start animating with the world's most advanced free software for 3D content creation.

Jul 2024 15h 12m

Unity 2022 by Example

Unity 2022 by Example

This book will introduce you to C# concepts and programming patterns in Unity that will help you solve common problems. After working on a range of 2D, 3D, AR, and VR game projects, you'll be able to confidently build playable and commercial games.

Jun 2024 19h 52m

Unity 2022 by Example

Unity 2022 by Example

This book will introduce you to C# concepts and programming patterns in Unity that will help you solve common problems. After working on a range of 2D, 3D, AR, and VR game projects, you'll be able to confidently build playable and commercial games.

Jun 2024 19h 52m

Unity 2022 by Example

Unity 2022 by Example

This book will introduce you to C# concepts and programming patterns in Unity that will help you solve common problems. After working on a range of 2D, 3D, AR, and VR game projects, you'll be able to confidently build playable and commercial games.

Jun 2024 19h 52m

Unity 2022 by Example

Unity 2022 by Example

This book will introduce you to C# concepts and programming patterns in Unity that will help you solve common problems. After working on a range of 2D, 3D, AR, and VR game projects, you'll be able to confidently build playable and commercial games.

Jun 2024 19h 52m

Unity 2022 by Example

Unity 2022 by Example

This book will introduce you to C# concepts and programming patterns in Unity that will help you solve common problems. After working on a range of 2D, 3D, AR, and VR game projects, you'll be able to confidently build playable and commercial games.

Jun 2024 19h 52m