Using Web Standards to create Interactive Data Visualizations for the Web
1. Using Web Standards to
create Interactive Data
Visualizations for the
Web
Nicolas Garcia Belmonte - Dec. 2009
2. Agenda
• JavaScript InfoVis Toolkit Overview
• Web Standards, JavaScript and Graphics
• What’s next for the JIT (v. 1.2)
• What’s next for Web Standards (WebGL)
• Introducing V8-GL
3. JavaScript InfoVis Toolkit
• Web Based Interactive Data Visualizations
• Multiple Graph/Tree Layouts
• Modular, Extensible, Composable
• Web Standards Based
9. Web Standards
JavaScript
• Dynamic, Expressive, Powerful
• Support in all Browsers
• Large Community
10. Web Standards
JavaScript: Language Features
• Dynamic
• Weakly typed
• Differential Inheritance
• First-class Functions
• Object Mutability
• Booleans as Defaults
• etc.
11. Web Standards
JavaScript: 100% Faster
SunSpider runs per minute
65.00
48.75
32.50
16.25
0
WebKit 3.0 WebKit 3.1 SquirrelFish SquirrelFish X
Source: http://webkit.org/blog/214/introducing-squirrelfish-extreme/
12. Web Standards
Everybody wants to make JavaScript Faster
• Apple Safari - SquirrelFish Extreme
• Mozilla Firefox - TraceMonkey
• Google Chrome - V8
• Opera - Carakan
19. Canvas
Benefits Weak Points
Good Performance No notion of elements
Simple API Code gets too verbose
20. Why JS + Canvas?
• Native Browser Technologies
• Seamless Integration
• High Interoperability
• No third-party libraries
• Access to a large community
23. JavaScript InfoVis Toolkit
Applications
Some (public) user Applications
CRS Management UI
ROOT project at CERN
Project at Macalester College
Game Stats at Dystopia
Neural Network Visualization
24. What’s next for the JIT?
Version 1.2
• SunBurst, Icicle and
Force-Directed
Visualizations
• Mouse Controlled
Transforms
• And more...
25. What’s next for the
Web?
WebGL
Already available in WebKit and Firefox nightlies (*)