Data Visualization Group in Bay AreaMeetup - April 2011

Mathieu Bastian, Data Scientist

Introduction

• Visualization of your LinkedIn Network

• A map of my career, leverage communities

• Big data, process 100M+ unique networks

Introduction

• Visualization of your LinkedIn Network

• A map of my career, leverage communities

• Big data, process 100M+ unique networks

• We need a Data Science Team

...

Interactive Visualization

Demo

inmaps.linkedinlabs.com

Manifesto

• Visually attractive

• Relevant

• Interactive

Manifesto

• Visually attractive

• Relevant

• Interactive

... And compatible with IE7+ and iPad

1. Data processing

• Pre compute what’s possible on Hadoop

• Force Directed layout on millions graphs

• Data stored on Voldemort

• Stack in Ruby, Java, LinkedIn APIs

2. Visualization

• Large networks, 10 000+ bezier curves

• We tried SVG, Canvas and more...

• We took the Google Maps approach

• Use images and add interactivity layer

• Seadragon + RaphaelJS

Seadragon

• Tiles (256px)

• Zoom & Pan

• IE6+

RaphaelJS

• Interactive

• SVG & VML

• IE6+

Map Design

• Layout and distances

Map Design

• Curved edges and density

Map Design

• Text readability and positioning

• Font between 10 and 14px

• 4 px outline, 80% alpha

• 2px vertical shift

• Avoid overlap

Q&A

http://inmaps.linkedinlabs.com