Do you want to showcase your data in easy and appealing ways? This course is for you!
Beautiful Data Visualization Projects in D3.js for Beginners will take you from zero coding experience to the point where you can build virtually any visualization you need!
Funded by a #1 Kickstarter Project
- 8.5 hours on-demand video
- 7 Articles
- 7 Supplemental Resources
- Full lifetime access
- Downloadable for offline access via the Teachable app
What Will I Learn?
- Create interactive charts – a scatter plot, with axis labels, axes, and dots.
- Generate lines for line plots.
- Create bar charts and make effects where users click on a webpage.
- Handle and read data from external sources.
- Create graphs with axes.
- Scale data to the appropriate size, perhaps the most important thing we will discuss.
- And more!
- No experience necessary!
- Atom, or another text editor like Sublime.
- Access to the Command Prompt on Windows. The Mac equivalent is the Terminal.
In the second phase of this course you'll set up a development environment.
- Watch over-the-shoulder to learn how to add D3 to you setup.
- You'll be introduced to examples of the projects made possible by D3.
- You'll get a thorough introduction to using the console for coding.
In the third phase of this course you'll learn how to handle and read data from any source. You'll learn to bind data in multiple ways.
In the fourth phase of this course you'll make your first projects in D3 using shapes. You'll learn how to create lines, circles, rectangles, bars. You'll be able to generate random data. You'll build numerous types of bar charts and add your first interactivity -- the click.
In the fifth phase of this course you'll learn to build complete scatter plots from scratch.
- Then you'll build more complex and beautiful plots like the bubble and pie chart.
- You'll be able to add effects like hovering to your visualizations.
- You will learn all about responsive design through practical, hands-on fun.
In the final phase of this course you'll build more projects and add tooltips, transitions, and repeating animations.
Working well with HTML and CSS, D3 has massive functionality when incorporated into a website.
Benefits of D3.js
- Interactivity. If you need data updating over each year, D3 updates very simply. Unlike most graphics, which are static, you can also incorporate hover and mouse click effects with visitors to your website.
- Functionality. D3 can create anything from axes to a scatter plot to an interactive geographical map using its GeoJSON functionality.
In Beautiful Data Visualization Projects in D3.js for Beginners you'll learn everything you need to create your own visually appealing graphics with code that you can embed into your website. These graphics can vary from a simple pie chart with a few hover effects to a complex scatter plot, to even a complex bubble chart.
You will be able to click on a screen to create circles on a webpage. You'll learn how to add this and more interesting effects to your website. We'll cover all this and more in this amazing D3.js course.
Enroll Now for Lifetime Access
- Anyone who wants to learn to work with data.
- Anyone curious about data visualization design.
Martin is a data analyst that has been applauded for his ability to make the complex simple. He grew up on a farm in northern Vermont and spent his summers helping his mom lead llama treks at Smugglers’ Notch Resort.
Martin graduated from University of Vermont with a degree in Mathematics. After graduation he left Vermont to work for an educational nonprofit called City Year for two years, and followed that up by attending the data science immersive program at Galvanize in Denver.
StartIntroduction to CSS (10:45)
StartIntroducing the Box Model (11:57)
StartWriting our First CSS (8:51)
StartEXAMPLES: More CSS (10:32)
StartMore on Type Selectors (9:04)
StartGetting Direct Descendants (8:01)
StartIntroduction to Classes (9:02)
StartMultiple Classes (4:03)
StartIntroduction to id (5:35)
StartCSS Specificity (7:25)
StartSelecting Multiple Pseudo Classes and Sibling Matching (10:33)
StartPROJECT: Styling Recipe Page (33:25)
StartLoading External Stylesheet (6:37)