⭐️ Watch the updated version of this course: https://youtu.be/2LhoCfjm8R4
In this data visualization course, you’ll learn how to transform data into meaningful graphical forms using D3.js and web technologies. D3 is a JavaScript library for visualizing data with HTML, SVG, and CSS. Besides teaching all about D3, this beginner's course also covers the basics of JavaScript, HTML, CSS, and SVG so you will have all the prerequisite knowledge to create stunning data visualizations.
Course created by Curran Kelleher. Check out his YouTube channel: https://www.youtube.com/channel/UCSwd_9jyX4YtDYm9p9MxQqw
You can create data visualization projects on VizHub: https://vizhub.com
⭐️ Course Contents & Code ⭐️
⌨️ (0:00:00) Data Visualization Course Overview
⌨️ (0:02:50) Why Visualize Data?
⌨️ (0:14:28) Inputs for Data Visualization: Data & Tasks
⌨️ (0:29:31) Intro to Javascript
Code: https://vizhub.com/curran/1e6587bb27c54c368deae8b79a7ca59a
⌨️ (1:57:35) Intro to HTML, CSS & SVG
Code: https://vizhub.com/curran/366c38ba5ebc4631b4bd936f3b709744
⌨️ (2:31:56) Intro to D3.js - Let's Make a Face!
Code: https://vizhub.com/68416/be771477cb974c938cd8603dd8b59d32
⌨️ (3:15:06) Making a Bar Chart with D3.js and SVG
Code: https://vizhub.com/curran/dd44f8fcdc8346ff90bddd63572bf638
⌨️ (3:44:02) Customizing Axes of a Bar Chart with D3.js
Code: https://vizhub.com/curran/a44b38541b6e47a4afdd2dfe67a302c5
⌨️ (4:10:03) Making a Scatter Plot with D3.js
Code: https://vizhub.com/curran/9247d4d42df74185980f7b1f7504dcc5
⌨️ (4:34:22) Making Line and Area Charts with D3.js
Code: https://vizhub.com/curran/012b5b20ce894b0fa7dc98ef3a0b43a5
⌨️ (5:04:36) The General Update Pattern of D3.js
Code: https://vizhub.com/curran/7f4137a77b564607ae2791ab1e49cf7e
⌨️ (6:04:30) Marks & Channels in Data Visualization
⌨️ (6:28:43) Interaction with Unidirectional Data Flow using D3.js
Code: https://vizhub.com/curran/c2274b1dfe914115bac48f437b3c104e
⌨️ (6:45:13) Making a World Map with D3
Code: https://vizhub.com/curran/c5475d7c95d348d5b8268012fbccb728
⌨️ (7:02:43) Cheap Tricks for Interaction on a D3.js World Map
Code: https://vizhub.com/curran/4fb5e4e665474a169325bd18cdc3d0c0
⌨️ (7:25:37) Blank Canvas
Code: https://vizhub.com/curran/0c35fdf97a6042188b5550e6712de315
⌨️ (7:30:43) Building a Tree Visualization of World Countries with D3.js
Code: https://vizhub.com/curran/4f92c793909f48d28012e43ddab716df
⌨️ (8:04:48) Color and Size Legends with D3.js
Code: https://vizhub.com/curran/92c34f62c0f948e89e87d28907c08715
⌨️ (8:33:27) Choropleth Map with D3.js
Code: https://vizhub.com/curran/d5ad96d1fe8148bd827a25230cc0f083
⌨️ (9:05:16) Interactive Filtering on a Choropleth Map
Code: https://vizhub.com/curran/5c907e49d0294538aad03ad1f41e1e28
⌨️ (9:51:00) Using Color in Visualization
⌨️ (10:07:54) Scatter Plot with Menus
Code: https://vizhub.com/curran/98ba4daacc92442f8d9fd7d91bfd712a
⌨️ (10:54:03) Circles on a Map
Code: https://vizhub.com/curran/8704c9b7c6df43cabf839aa3f1cb7b70
⌨️ (11:35:51) Line Chart with Multiple Lines
Code: https://vizhub.com/curran/2546209d161e4294802c4ac0098bebc2
⌨️ (11:59:34) Melting and Munging Data with JavaScript
Code: https://vizhub.com/curran/ecb0793c7d674100b3e3133d92cb6957
⌨️ (12:28:29) Selecting a Year on a Line Chart
Code: https://vizhub.com/curran/501f3fe24cfb4e6785ac75008b530a83
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://www.freecodecamp.org/news
https://www.youtube.com/watch?v=coQ5dg8wM2o