Introduction to data visualization with D3.js

Introduction to Data Visualization with D3.js:

D3.js is a web-based platform based on javascript that is designed specifically for all kinds of data visualization. Basically, the numerical tables are converted to more meaningful plots, charts, maps, etc. in order to convey the most important message that is hidden in your data. In comparison to traditional visualization environments, D3.js has the advantage of immediate interactivity through website frameworks as well as other shareable environments such as Observable. The bubble chart embedded in this website from this example shows how D3.js might be used as a real time interactive visualization platform and be integrated directly in your website.

Creating account and login into observable:

D3.js basically is a javascript package developed specifically for data visualization. This package could be used in all javascripts' developing environments, but in this workshop in order to facilitate its usage for introducing most important features of D3.js package, we use Observable online notebook platform as our developing environment to test and run javascripts to visualize the data.

In order to create an account in Observable website, go to https://observablehq.com/ and follow these steps:

  1. Click on Sign in:

2. Click on Create an account:

3. Use your Google account and choose Continue with Google:

4. Choose your Google account and then type the desired username here as whatever you prefer and is available:

If you logged in successfully, you should see the empty dashboard of Observable platform similar to this one:

DOWNLOADING DATA: