d3.js
Mind blow
by Anton
aka @antulik
Theme for the talk
WAT?
Harlem Shake
youtube
all on youtube and it's blocked
there is no wifi signal in this room anyway
No probs, use phone tethering
bug which reload the page
No probs, Firefox
1.5GB of RAM
Mind blow
minecraft - 2 levels in 4 hours
http://www.planetminecraft.com/blog/2-levels-in-4-hours/
Workshop based on workshop by Mike Bostock
which is 3+ hours
2 hours in 4 hours
D3js
Stats
Numbers
Github
-
Rails
stars: 17 350
forks: 4 860
-
D3
stars: 12 190
forks: 1 995
Github?
My personal experience
- Ruby & Rails
2 years
somewhat average or higher
(or maybe not)
- D3
a bit over 1 year
I'm a noob
Hardest things to learn
before
- Assembler / C / Kernel compilation
/ POSIX - VBA
- Java
40. Javascript
1000. Ruby
Hardest things to learn
and now
- D3.js
- the rest
awesomeness
D3.js is hard
Seems like everybody
would agree with that
D3.js is going to stay
- Beautiful levels of abstractions
- Doesn't limit you
- Doesn't force many conventions
- Good documentation
- Good modular design
- Powerful
D3.js is a tool
it does one thing
and it does it very well
So why such reputation
it's not technology
but mind shift
Mind shift?
OOP
It's like learning OOP
but for visualisations
It's just a tool
It gives all the power to the user
You still need to do all the job
Speaking in French doesn't make you smarter
D3.js is annoying
it takes 2 hours to write 10 lines
With all that power
Tool is no longer limitation
but we are
How i've started
TopicRay
Sep 2011
Topicray
is multi-threaded chat system
mind map + chat = topicray
Topicray
hierarchical data
very very deep hierarchical data
version 1
Started with html
Version 4
then moved to canvas and ocanvas
Version 9, 10, 11
try to improve canvas implementation
Version 13, 14
D3.JS enters the stage
Version 19, 20
improvements on icicle graph
Version 21, 22
it's radar time
Version 23
1 year old
My second project
StoryLine
Sep 2012
Storyline
Calendar visualisation
think
Calendar + Google Maps = StoryLine
Let's go
Lesson learnt, started with D3
Show off
Four Ways to Slice Obama’s 2013 Budget Proposal
Over the Decades, How States Have Shifted
512 Paths to the White House
D3 Show Reel
The Wealth & Health of Nations
Urban Water Explorer
Nutrient Contents
How Obama Won Re-election
Coffee Flavour Wheel
Les Misérables Co-occurrence
Wordcloud
Force collapsable
Treemap
Flare imports
Build Your Own Graph
Interactive Publication History
CLOSE VOTES
History's Largest Empires
Basic charts
Bar Chart
http://bl.ocks.org/3885304
Line Chart
http://bl.ocks.org/3883245
The hero
Mike Bostock
on vimeo
MIKE BOSTOCK
on github
Stanford
http://vis.stanford.edu/
Links
- Homepage
http://bost.ocks.org/mike/
- Blog: http://www.tumblr.com/tagged/mike%20bostock
- Github
https://github.com/mbostock
- Blocks
http://bl.ocks.org/mbostock