What is D3?

Data-Driven Document, an open-source JavaScript library developed by Mike Bostock used to reate custom interactive data visualizations in the web browser using SVG, HTML and CSS.

Below are few major interesting features of D3

Data Driven Elements => Empowers data to dynamically generate elements and supply styles to the eyements.
Dynamic Properties => It empowers your data to dynamically generate elements and apply styles to the elements, be it a table, a graph or any other HTML element and/or group of elements.
Types of visualization => Enables you to create anything from an HTML table to a Pie chart, from graphs and bar charts to geospatial maps.
Custom Visualizations => It is possible to generate custom visualisations.
Transitions : D3 provides the transition() function. This is quite powerful because internally, D3 works out the logic to interpolate between your values and find the intermittent states.
Interaction and animation : D3 provides great support for animation with functions like duration(), delay() and ease(). Animations from one state to another are fast and responsive to user interactions.

A bit of note on SVG:

SVG is a way to render images on the web page. SVG is not a direct image but is just a way to create images using text. As it's name suggests, it is scalable vector. It scales itself according to the size of the browser, so resizing your browser will not distort the image. All browsers support SVG except IE 8 and below.

We can thing of SVG as a canvas on which you can paint different shapes.
Simple SVG looks like this that shows a yellow rectangular box


   

References:
https://www.tutorialsteacher.com/d3js