Data Visualization

Overview

Data is all around us, but it doesn't mean much without shape or context.

In the Data Visualization Certification, you'll build charts, graphs, and maps to present different types of data with the D3.js library.

You'll also learn about JSON (JavaScript Object Notation), and how to work with data online using an API (Application Programming Interface).

Major Topics:

Data Visualization with D3
JSON APIs and Ajax
Data Visualization Projects

Syllabus

Add Document Elements with D3
Select a Group of Elements with D3
Work with Data in D3
Work with Dynamic Data in D3
Add Inline Styling to Elements
Change Styles Based on Data
Add Classes with D3
Update the Height of an Element Dynamically
Change the Presentation of a Bar Chart
Learn About SVG in D3
Display Shapes with SVG
Create a Bar for Each Data Point in the Set
Dynamically Set the Coordinates for Each Bar
Dynamically Change the Height of Each Bar
Invert SVG Elements
Change the Color of an SVG Element
Add Labels to D3 Elements
Style D3 Labels
Add a Hover Effect to a D3 Element
Add a Tooltip to a D3 Element
Create a Scatterplot with SVG Circles
Add Attributes to the Circle Elements
Add Labels to Scatter Plot Circles
Create a Linear Scale with D3
Set a Domain and a Range on a Scale
Use the d3.max and d3.min Functions to Find Minimum and Maximum Values in a Dataset
Use Dynamic Scales
Use a Pre-Defined Scale to Place Elements
Add Axes to a Visualization
Handle Click Events with JavaScript using the onclick property
Change Text with click Events
Get JSON with the JavaScript XMLHttpRequest Method
Get JSON with the JavaScript fetch method
Access the JSON Data from an API
Convert JSON Data to HTML
Render Images from Data Sources
Pre-filter JSON to Get the Data You Need
Get Geolocation Data to Find A User's GPS Coordinates
Post Data with the JavaScript XMLHttpRequest Method
Visualize Data with a Bar Chart
Visualize Data with a Scatterplot Graph
Visualize Data with a Heat Map
Visualize Data with a Choropleth Map
Visualize Data with a Treemap Diagram

Taught by

freeCodeCamp Team

Reviews

5.0 rating, based on 1 Class Central review

Start your review of Data Visualization

Luke S @lucasrsorenson

There was a while when I thought that this course was kind of unnecessary because of the esoteric application (mainly building graphs and charts from data). I didn't think that this skillset would really be helpful in getting a job, unless I was try…

There was a while when I thought that this course was kind of unnecessary because of the esoteric application (mainly building graphs and charts from data). I didn't think that this skillset would really be helpful in getting a job, unless I was trying to work in a very corporate setting. However, having been in a professional programming role for a year now, I can definitely say that even if you never end up actually using D3.js (incidentally, I did end up coming across it in my job), this course is great practice for 1) learning and using a niche library and having to dig into the documentation and StackOverflow, and 2) interacting with and using data from external APIs. These are both skills that you will need as a web developer. My entire Web Dev job essentially revolves around working with different libraries and APIs.

Taught by

Data Visualization with D3.js - Full Tutorial Course

Introduction to D3.js

Let's learn D3.js - D3 for data visualization (full course)

Create A Bar Chart with React and D3

Learn D3

Data Visualization for React Developers

Never Stop Learning.