Justin McMurdie

Software Engineer

Mechanical Keyboards

Star Wars

Video Games

Star Wars Video Games

Movies

Star Wars Movies/TV

Overview

• What is D3js
• Common uses of D3.js
  • Charts
  • SVG
  • D3.js libraries
• Intro to SVG & D3.js
• Building a chart

What is D3.js

• Data Binding Library
• Arbitrarily Binding Data to the DOM

What isn't D3.js

• Full Framework for managing components
• A library of customizable charts

Common Uses of D3.js

Chart Libraries

built on D3.js

• Prebuilt Charts
  • NVd3
  • More: https://github.com/zingchart/awesome-charting

Intro to d3js

What can d3js do?

Budget Proposal: http://goo.gl/XrfzHw

French First Names: http://goo.gl/bGCnpn

National Convention: http://goo.gl/u9rlIf

Introduction to SVG & D3js

SVG at a glance

• XML structure
• Draws with Painter's Algorithm

XML structure

Painters Algorithm

"Painter's algorithm" by Zapyon - Own work. Licensed under CC BY-SA 3.0 via Commons