Learning D3

1. Learn about the technology fundamentals for D3.js
   If you are not yet familiar with basic web technologies, we recommend you to look it up online (Learn to Code HTML & CSS, MDN web docs or w3schools)
2. Read the Intro to D3 and implement your first D3 visualizations
3. Learn more about scales. Perhaps the most important concept in D3 that helps you to map abstract data to visual variables.
4. Follow various tutorials, inspect code examples & live demos, and create your own D3 visualizations.
   • Learn how to draw shapes in D3 (d3-shape)
   • Check out the brush & zoom example to see how focus+context can be implemented in D3
   • Render geographic information
   • Create a force-directed graph
   Try out the Bl.ock Builder, an online editor for creating and sharing D3 examples. You can fork a block you like and make modifications or extensions.
5. Selections enable us to manipulate individual elements based on our data. This concept is an essential building block of D3 but at the beginning it might seem a bit confusing. Read Thinking with Joins and check out the General Update Pattern (Part 1 | Part 2 | Part 3) and you will easily master D3's enter, update, and exit selections.
6. Further tutorials:
   • D3 and Canvas in 3 steps
   • A responsive D3 example that resizes automatically with your browser window

D3 Book

• Vega & Vega Lite
  "Vega is a declarative language for creating, saving, and sharing interactive visualization designs." JSON specifications are parsed by Vega to generate interactive views using either HTML5 Canvas or SVG.
• R + Shiny
  Shiny is an R package used to generate web applications containing interactive data analysis and visualization elements. No knowledge of HTML, CSS, JavaScript is required. Code is written in R.
• ggplot2 for R and ggplot for Python
  Visualization packages for R and Python, based on Wilkinson's Grammar of Graphics.

• Bokeh
  If you want to create interactive visualizations with Python, you might want to look at Bokeh as an alternative to matplotlib or ggplot which are mostly used for static visualizations.
• Processing & p5.js
  Processing is a Java-based language and software environment that is used extensively for data visualizations (supports WebGL/OpenGL). p5.js is a JavaScript library based on the same idea of Processing.
• Chart.js
  D3 is a low-level library that allows you highly flexible, data-driven modifications of the DOM tree. However, if you want to create simple charts without much interactivity, you can try Chart.js (or NVD3).