Presenting D3.js

DSC 106: Data Visualization

Father and bread-winner


Mike Bostok
PhD at Stanford
Former employee of "NY Times"
and other 117 contributors ...

What is D3?

D3 is collection of js modules , designed to work together

Good:
  • Very popular - 5-th place on github
  • Extremely flexible - It's easy to change something
  • Very fast - Can work with 3-5 thousand dom elements
  • D3 can be used with - Angular, React, Vue

  • Bad:
  • Learning curve - After 1 year, still left many things to learn
  • Decomposing

    Visual Parts Helpers

    Differences

    Other libraries d3
    Low - Helper methods yep . yep .
    Middle - chart parts yep . nope .
    High -api invoke nope - strict . nope - broad .
    example

    Client Requests

    Common layouts

    Line Area Pie Tree
    Treemap Pack Force Projections

    Impressive Examples

    Modules

    D3 has following modules

    Requests

    ages districts

    Selections

    .rect
    .rect
    .rect
    .rect

    Scales




    Axes

    I am svg with class 'axes-svg'

    SVG

    svg = scallable vector graphic

    svg attributes







    svg attributes with chaining


    Thanks

    Now we will do some tryclassbuzz questions here as a mid-quarter check-in and attendance