Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Graph Visualization Andreas Kollegger
How is graph visualization useful? • As a thinking tool, to visually organize information • As a development tool, for wor...
Graph usefulness generally maps 
 to different graph sizes Tiny Small Large Giant
Tiny Graphs • Use: Communication of a few concepts within a specific context • Social Scale: family-size • Features: • Nod...
Tiny Graphs: What is a graph?
Tiny Graphs: What is a graph? Ann Loves Dan
Tiny Graphs: What is a graph? Ann Loves Dan
Tiny Graphs: What is a graph? Ann Loves Dan Node Relationship Node
State Diagram
Workflow Diagram
Domain Diagram
Infographics • https://www.dreamstime.com/
Small Graphs • Uses: Navigation based on connectivity • Social Scale: family-size up to a neighborhood • Features: • Node ...
Computer Network Diagram
Org Chart
Route Maps
Board Members
Large Graphs • Use: Aggregate analysis • Social Scale: small town • Features: • Node Count: 10’s of thousands of nodes • D...
Protein Network • A network diagram showing protein interactions inside a cell carousel • Red and yellow are drug targets;...
Twitter Communities • An individual’s twitter connections • Color coded communities identified based on topic area of post...
Harry Potter Fanfiction • Colored by language • http://colah.github.io/posts/2014-07-FFN-Graphs-Vis/
Giant Graphs • Use: to impress • Social Scale: global • Features: • Node Count: 100’s of thousands to millions and beyond ...
Twitter Network Sample • A sample network of Twitter users • Shows all 415,808 nodes, but none of the 283,317 edges • http...
Twitter Network
 Sample • Same network layout, with only edges shown • https://dhs.stanford.edu/
Twitter Network Sample • Now with nodes and relationships • Force-directed layout • https://dhs.stanford.edu/
Cosmic Web • Discrete galaxies, connected by gravity • http://cosmicweb.barabasilab.com
Brain • Visualization of biological neural network • https://github.com/nxxcxx/Neural-Network
Internet Routes • Visualization of network routes across the Internet in 2005 • By The Opte Project
Simplifying the Complexity
Area Grouping • Group nodes together • Each group has an internal
 layout • Overall layout is group
 to group
Node Clustering By Similarity
Edge Bundling - Unbundled
Edge Bundling - Bundled
The Cycle of Complexity Increase Scale Aggregate Tiny Small Large Giant Small Large
Alternative Graph Representations And Other Chart Types
Radial Tree • A tree centered on a focus node • Navigation re- centers the tree • https://github.com/d3/d3/wiki/Gallery
Geo Map • Node layout anchored by geospatial location • https://github.com/d3/d3/wiki/Gallery
Chord Diagram • Useful for showing relationship bundles between groups, and sub- groups • https://github.com/d3/d3/wiki/Ga...
Circle Packing • Awesome for drill- down overview of data sub-categories • https://github.com/d3/d3/wiki/Gallery
Sankey Diagrams • Perfect for emphasizing numerical values on relationships • https://github.com/d3/d3/wiki/Gallery
Thanks! What would you like to do with graph visualization? Andreas Kollegger andreas@neo4j.com @akollegger
Upcoming SlideShare
Loading in …5
×
Technology
1,432 views
Aug. 23, 2017

Exploring Graph Visualization

Data visualization is a marvelous way to understand and communicate complex ideas. Graph visualization expands the expressive power of the medium, revealing patterns and connections that put everything in context.

During this webinar, we explore the many beautiful and informative uses of graph visualization.

no profile picture user

  • Login to see the comments

Exploring Graph Visualization

  1. 1. Graph Visualization Andreas Kollegger
  2. 2. How is graph visualization useful? • As a thinking tool, to visually organize information • As a development tool, for working with connected data • As a communication tool, for describing what is in the graph • As an interactive tool, for exploring relationships • As a reporting tool, for summarizing business information • As an analysis tool, for revealing trends, anomalies, structure • In general — when you’re interested in how things are connected
  3. 3. Graph usefulness generally maps 
 to different graph sizes Tiny Small Large Giant
  4. 4. Tiny Graphs • Use: Communication of a few concepts within a specific context • Social Scale: family-size • Features: • Node Count: up to a double-digit • Detail: detailed node information
  5. 5. Tiny Graphs: What is a graph?
  6. 6. Tiny Graphs: What is a graph? Ann Loves Dan
  7. 7. Tiny Graphs: What is a graph? Ann Loves Dan
  8. 8. Tiny Graphs: What is a graph? Ann Loves Dan Node Relationship Node
  9. 9. State Diagram
  10. 10. Workflow Diagram
  11. 11. Domain Diagram
  12. 12. Infographics • https://www.dreamstime.com/
  13. 13. Small Graphs • Uses: Navigation based on connectivity • Social Scale: family-size up to a neighborhood • Features: • Node Count: hundreds of nodes • Detail: representative node information
  14. 14. Computer Network Diagram
  15. 15. Org Chart
  16. 16. Route Maps
  17. 17. Board Members
  18. 18. Large Graphs • Use: Aggregate analysis • Social Scale: small town • Features: • Node Count: 10’s of thousands of nodes • Detail: cluster categorization
  19. 19. Protein Network • A network diagram showing protein interactions inside a cell carousel • Red and yellow are drug targets; red is cancer, yellow is other diseases • http://oncologynews.com.au/
  20. 20. Twitter Communities • An individual’s twitter connections • Color coded communities identified based on topic area of posts • http://oncologynews.com.au/map-of-drugs-reveals-uncharted-waters-in-search-for-new-treatments/
  21. 21. Harry Potter Fanfiction • Colored by language • http://colah.github.io/posts/2014-07-FFN-Graphs-Vis/
  22. 22. Giant Graphs • Use: to impress • Social Scale: global • Features: • Node Count: 100’s of thousands to millions and beyond • Detail: large-scale structure coloring
  23. 23. Twitter Network Sample • A sample network of Twitter users • Shows all 415,808 nodes, but none of the 283,317 edges • https://dhs.stanford.edu/
  24. 24. Twitter Network
 Sample • Same network layout, with only edges shown • https://dhs.stanford.edu/
  25. 25. Twitter Network Sample • Now with nodes and relationships • Force-directed layout • https://dhs.stanford.edu/
  26. 26. Cosmic Web • Discrete galaxies, connected by gravity • http://cosmicweb.barabasilab.com
  27. 27. Brain • Visualization of biological neural network • https://github.com/nxxcxx/Neural-Network
  28. 28. Internet Routes • Visualization of network routes across the Internet in 2005 • By The Opte Project
  29. 29. Simplifying the Complexity
  30. 30. Area Grouping • Group nodes together • Each group has an internal
 layout • Overall layout is group
 to group
  31. 31. Node Clustering By Similarity
  32. 32. Edge Bundling - Unbundled
  33. 33. Edge Bundling - Bundled
  34. 34. The Cycle of Complexity Increase Scale Aggregate Tiny Small Large Giant Small Large
  35. 35. Alternative Graph Representations And Other Chart Types
  36. 36. Radial Tree • A tree centered on a focus node • Navigation re- centers the tree • https://github.com/d3/d3/wiki/Gallery
  37. 37. Geo Map • Node layout anchored by geospatial location • https://github.com/d3/d3/wiki/Gallery
  38. 38. Chord Diagram • Useful for showing relationship bundles between groups, and sub- groups • https://github.com/d3/d3/wiki/Gallery
  39. 39. Circle Packing • Awesome for drill- down overview of data sub-categories • https://github.com/d3/d3/wiki/Gallery
  40. 40. Sankey Diagrams • Perfect for emphasizing numerical values on relationships • https://github.com/d3/d3/wiki/Gallery
  41. 41. Thanks! What would you like to do with graph visualization? Andreas Kollegger andreas@neo4j.com @akollegger

×