Introduction to scales
Building a graph requires transforming a dimension (a numeric variable in your dataset) into a position in pixels. This is done using a fundamental dataviz concept called scale.
Before implementing it in the next lesson, let's explore what this crucial concept is all about.
Test your intuition
Let's test your intuition with the following exercise.
- You have an SVG area with a width of
500px. - You can place circles anywhere along this area horizontally.
- You have a dataset with 5 values:
0,50,60,82,100
→ How do you position your circles to represent this dataset? Drag the circles below following your intuition:
Note: the number in each circle represents its value in the dataset.
Oh no! 😱
It seems like you haven't enrolled in the course yet!
Join many other students today and learn how to create bespoke, interactive graphs with d3.js and React!
Enrollment is currently closed. Join the waitlist to be notified when doors reopen:
Or Login