Animating
Graph Theory
David Anderson
EdgeCase
@eymiha
Mighty 52
*some disclaimers
I write software for a living.
I like Math.
I am a rank amateur.
Math is about Visualization
It all started with comparison
Math is about Visualization
It all started with comparison
amount
Math is about Visualization
It all started with comparison
ç√
amount
ç√
proximity
Graph Theory is about
Connectivity
Reasoning with Circles and Arrows
Graph Theory is about
Connectivity
Reasoning with Circles and Arrows
organization
Graph Theory is about
Connectivity
Reasoning with Circles and Arrows
organization
flow
Graph Theory is Easy
Circles and Arrows make intuitive sense!
A
B
Graph Theory is Hard
Reasoning is best left to professionals
Graph Theory is Hard
Reasoning is best left to professionals
But it seems like it should be easy.
Graph Theory is Hard
Reasoning is best left to professionals
But it seems like it should be easy. Dammit.
Graph Theory is Magic
Any
sufficiently
advanced
technology
is
indistinguishable
from magic.
- Arthur C. Clarke
The Path of Learning
Beginner
“awesome!”
Novice
“hmmm...”
Expert
“that make sense.”
How Do Normal People
Become Adept
Beginner
“wtf?!”
Novice
“if you say so...”
Expert
“that make sense.”
The Education Problem
How do we
more effectively get
more beginners to the novice stage
and
more novices to the expert stage?
*another disclaimer
My actual educational
experience is limited to the
student side of the room.
people think with their
EYES
Seeing is believing.
The Mind’s Eye.
Paying attention to what’s behind the curtain.
people understand
MECHANISMS
Rube Goldberg was a freaking genius.
Step-by-step thinking.
Mechanisms are what’s behind the curtain.
Mathematics is
Expressed Mechanically
Through Algorithms
Quantify - calculating values
Qualify - classifying results
Transform - rewriting forms
Mathematics is
Expressed Mechanically
Through Algorithms
Quantify - calculating values
Qualify - classifying results
Transform - rewriting forms
as is Graph Theory
Ubiquitous Information
Today, isn’t it just incredible to be able to
get information about everything you find
interesting on your
desktop, laptop, pad or phone?
Ubiquitous Information
Today, isn’t it just incredible to be able to
get information about everything you find
interesting on your
desktop, laptop, pad or phone?
No, I’m not talking
about CAT PICTURES!
Ubiquitous Information
Why can’t I get information on Graph
Theory Algorithms on the Web?
Ubiquitous Information
Why can’t I get information on Graph
Theory Algorithms on the Web?
Well, these days you can.
Ubiquitous Information
Why can’t I get information on Graph
Theory Algorithms on the Web?
Well, these days you can.
Why can’t I run Graph Theory Algorithms
on the Web?
Ubiquitous Information
Why can’t I get information on Graph
Theory Algorithms on the Web?
Well, these days you can.
Why can’t I run Graph Theory Algorithms
on the Web?
Yeah, that would be so sweet.
Animated Algorithms
They show you how things work!
Vision is the highest bandwidth sense for
conveying non-sensory information.
You get the feel for how things work by
watching them work.
We finally get Math books with moving
pictures.
Playback control - step by step, rewind, fast
forward, etc.
Animation on the Web
We’re not talking about
pre-recorded video...
Animation on the Web
We’re not talking about
pre-recorded video...
We’re talking about programmatically
generated graphics!
Animation on the Web
We’re not talking about
pre-recorded video...
We’re talking about programmatically
generated graphics!
So, let’s borrow back from
programmers...
Programming
Software is just Mathematics
executed in finite speed
with finite memory.
*a claimer
I guess I am sort of a mathematician...
The Technology Needed
To See Graph Theory
Algorithms Run On WebEnabled Devices Is
Readily Available Today.
Animation on the Web
JavaScript
Runs native in every web browser enabling
complete ubiquity.
A dynamic object-oriented language based
on prototypal inheritance.
A rich base of well-tested code exists that
developers have written to do animation.
d3.js
Brainchild of Mike Bostock
(@mbostock, http://bost.ocks.org/mike/)
Efficient manipulation of documents based on
data.
Extremely small and fast.
Bind data to the DOM and spply data-driven
transformations.
Let’s see some simple animations...
Next Steps
Build a DSL for expressing Graph Theory
Algorithms and Animations.
Build a web-based system for creating,
storing and Graph Theory animations.
Build it all in open source.
Make it freely available.
Guiding Lights
Graph Theorists can publish their work in a
ubiquitous form.
They can review and test each other’s work
more quickly and easily.
They can build on the work of others.
They can more quickly understand how new
developments in Graph Theory work.
Thanks for Listening...
Any Questions?
David Anderson @eymiha [email protected]