---
id: 695b9093a0c45b36932dcbcb
title: What Is the D3 Library Used For?
challengeType: 19
dashedName: what-is-the-d3-library-used-for
---

# --description--

In the prior lessons, you were introduced to data visualization which is the process of creating clear, visual formats to represent complex data. In this lesson, you will learn about the D3 library.

The D3 library is a free and open source library you can use to create compelling and effective data visualizations in JavaScript.

<img src="https://cdn.freecodecamp.org/curriculum/lecture-transcripts/what-is-the-d3-library-used-for-1.png" alt="A graph with four nodes labeled A, B, C, and D. Node A connects to B, C, and D. Node B connects to A and D. Node C connects to A. Node D connects to A and B. It's the same image as before.">


The name D3 is an abbreviation for data-driven documents, referring to how it dynamically binds data to elements in the Document Object Model (DOM). This library is flexible and works naturally with the web. Instead of having to learn a whole new graphical representation, you can build data visualizations with `svg` and `canvas` elements.

For example, if you want to create a bar chart using D3, you can do the following all in one JS file:

* Declare variables representing the chart dimensions and margins
    
* Declare the horizontal position scale
    
* Declare the vertical position scale
    
* Create the SVG container with the bars and labels
    
<img src="https://cdn.freecodecamp.org/curriculum/lecture-transcripts/what-is-the-d3-library-used-for-2.png" alt="A graph with four nodes labeled A, B, C, and D. Node A connects to B, C, and D. Node B connects to A and D. Node C connects to A. Node D connects to A and B. It's the same image as before.">

So what are some other reasons to learn D3 over other visualization tools like Chart.js, Plotly, or Tableau?

Unlike other tools, D3 provides you with a lot of low-level control where you can build customizable and interactive visualizations with just vanilla HTML, CSS, and JavaScript. Plus, the library is in JavaScript, so you don't need to worry about learning a whole new language.

In upcoming workshops and labs, you will learn the fundamentals of the D3 library, like selections, shapes, and scales. You will learn these key concepts by building scatterplot graphs, bar charts, dashboard apps, and more.

# --questions--

## --text--

What is the D3 library?

## --answers--

 A free and open source library for creating compilers.

### --feedback--

Refer back to the beginning of the lesson for the answer.

---

A free and open source library for creating interactive forms and tables.

### --feedback--

Refer back to the beginning of the lesson for the answer.

---

A free and open source library for creating data visualizations in JavaScript.

---

A free and open source library for creating microservices.

### --feedback--

Refer back to the beginning of the lesson for the answer.

## --video-solution--

3

## --text--

What is one advantage to using D3 over another tool like Chart.js or Tableau?

## --answers--

 D3 automatically generates all chart types with minimal configuration, similar to drag-and-drop tools.

### --feedback--

Think about the level of control D3 provides you.

---

D3 provides you with low-level control so you can build customizable and interactive visualizations.

---

D3 includes a built-in GUI (graphical user interface) for creating dashboards without writing code.

### --feedback--

Think about the level of control D3 provides you.

---

D3 uses a completely new programming language designed for data visualization.

### --feedback--

Think about the level of control D3 provides you.

## --video-solution--

2

## --text--

What is a type of project you will build in this data visualization module?

## --answers--

e-commerce site

### --feedback--

Refer to the end of the lesson for the answer.

---

express server

### --feedback--

Refer to the end of the lesson for the answer.

---

discord bot

### --feedback--

Refer to the end of the lesson for the answer.

---

scatterplot graph

## --video-solution--

4
