Learn how to use DC.js in coordination with Crossfilter and D3.js to create interactive dashboards and widgets that display bar charts, scatterplots, heatmaps, and more.
Overview
Syllabus
Introduction
- Welcome
- What is DC?
- Assessing your current skills
- Finding a code editor
- Recalling webpage basics: HTML, CSS, and SVG
- Downloading dc.js with its dependencies
- Setting up dummy data
- Seeing your data with console.log and print_filter
- Checking the DOM
- Making a bar chart
- Modifying our bar chart
- Working with dates to make a line or area chart
- Making a stack area chart with legend
- Exploring SVG with a pie chart
- Making a scatter plot
- Making a bubble chart
- Making a data table with bootstrap
- Understanding common attributes
- Making a stacked bar chart
- Importing CSV data for a boxplot
- Making a series chart
- Combining chart types with composite
- Making a map (choropleth)
- Getting creative with dataGrid
- Linking two charts together
- Understanding graphical filtering
- Filtering with a range chart
- Filtering with brush
- Filtering with brush in two dimensions
- Adding finishing touches with dc.dataCount and Reset All
- Adding finishing touches with filterPrinter & numberDisplay
- Complementing DC with D3
- Goodbye
Taught by
Emma Saunders