This course has been updated! We now recommend you take the Introduction to D3.js course.

Check out a free preview of the full Introduction to Data Visualization with d3.js v4 course:
The "Challenge 1: Creating a Chart" Lesson is part of the full, Introduction to Data Visualization with d3.js v4 course featured in this preview video. Here's what you'd learn in this lesson:

In this challenge, students use d3.js recreate a temperature for a city scaled over set period of years.

Get Unlimited Access Now

Transcript from the "Challenge 1: Creating a Chart" Lesson

[00:00:00]
>> Shirley: I want us to make that with everything that we've learned so far. With the first goal being just getting all of these bars using the right scales. And then a extra bonus if you can get the axes in there also. And I provided the starter code in there.

[00:00:21] And, so this is the starter code and then really briefly, this data site is the temperatures across a certain number of years for three different cities and I've just, let me show you the data also. This is what the data looks like, I realize it's really ugly to look at the raw data.

[00:00:52] But it's essentially a CSV and there's four attributes, the date itself, the temperature for New York, the temperature for San Francisco, and the temperature for Austin. So,
>> Shirley: Will you make me a,
>> Shirley: Bar chart If all of the temperatures, for any of, for one of the cities you're choosing, scale it correctly where the x is your date and the y is your temperature of one of the cities and, yeah and this is kind of what we were talking about before and Allison, yes that's her name.

[00:01:39] And that was what we were talking about if you have a nonstandard date format, you can use three dot time parse to get that.