From the course: D3.js Essential Training for Data Scientists
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Using colour scales - D3.js Tutorial
From the course: D3.js Essential Training for Data Scientists
Using colour scales
- [Instructor] In D3, we often use color to express data. For example, a darker color might mean a higher value or red might mean one thing and green another. In cases where color is a range, it's appropriate to use a scale, since a scale just translates values from one range into values in another. We're just going to look quickly at some of the color ranges that D3 provides for us automatically. There are eight here: interpolate warm, interpolate cool, interpolate rainbow, that's the one we're going to be using shortly. You can see there's a few of them. Now actually, you can generate your own custom ranges as you see fit, but for now we're going to use interpolate rainbow because it's got the greatest number of quite bright colors. So what we're going to do, back in our shapes file, is color our rectangles using one of those color ranges. The first thing to do is to declare a new color scale. And we're going to say var rainbow equals d3.scaleSequential().domain(). Color scales…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
Introducing scales3m 10s
-
(Locked)
Creating a linear scale3m 11s
-
(Locked)
Creating a linear axis5m 57s
-
(Locked)
Positioning and formatting our axis5m
-
(Locked)
Creating a time scale5m 9s
-
(Locked)
Creating a time series axis3m 24s
-
(Locked)
Creating an ordinal scale and axis5m 53s
-
(Locked)
Using colour scales5m 17s
-
(Locked)
Introducing other scales2m 20s
-
-
-
-
-
-
-