SuperHi FM

Search:

Catalog Cart About Sign in

Data Visualization + D3.js

Step Count – Extending D3

Chapter 04

Step Count – Extending D3

Links + downloads

Chapter resources

Chapter URL

Videos

Lesson 01

Welcome to the final part of Step Count

Lesson 02

Adding in a transition

Lesson 03

Adding delay and easing to transitions

Lesson 04

Adding transitions to our bar chart

Lesson 05

Why we group tags in our visualizations

Lesson 06

Adding g tags to our bar chart

Lesson 07

Adding our second text tags

Lesson 08

Adding hover states using CSS

Lesson 09

Adding both classes and states in CSS

Lesson 10

Hovering within a group

Lesson 11

Adding a group for our circles

Lesson 12

Adding in goal rings using stroke

Lesson 13

Adding text to our Last 28 Days section

Lesson 14

Altering HTML content

Lesson 15

D3's array functions

Lesson 16

Using D3 Format

Lesson 17

Homework

Lesson 18

Homework solution

SuperHi FM

Want some ambient music in the background? Play our radio station!

Heat map

Next: Chapter 05

Heat map

Step Count – Introducing D3

Back: Chapter 03

Step Count – Introducing D3

Feeling stuck?

Don’t worry, we are here to help you with:

Speedy help from one of our team members
Detailed, relevant solutions
Direct access to peer support through Discord!

Remember, there’s no such thing as a silly question, so don’t hesitate to reach out, we love hearing from you!

© 2024 SuperHi, Inc.

Learn

All courses Code Design Project management SuperHi Editor

Company

About Student work SuperHi for Business NEW Careers Newsletter

Support

Return policy Terms of use Discrimination policy Code of conduct Contact us

D3 comes with a lot of tools as part of the library. In this session, we'll add transitions with delays and easing, talk about the importance of grouping, and use D3's array functions to save us time!

Private notes

A place for you to post notes about anything on this page. Only you can view your notes.

Sign in to save notes