GithubHelp home page GithubHelp logo

antek-drzewiecki / data-visualization-week3-assignment Goto Github PK

View Code? Open in Web Editor NEW
0.0 2.0 2.0 7.75 MB

Coursera Data Visualization PA2: American football games between Division IA colleges during regular season Fall 2000

JavaScript 99.21% HTML 0.79%

data-visualization-week3-assignment's Introduction

data-visualization-week3-assignment

American football games between Division IA colleges during regular season Fall 2000

What is the data that you chose? Why?

You are looking at a undirected force graph data visualization from American football games between Division IA colleges during regular season Fall 2000. As originally visualized here. I took this dataset because it was a complex set to visualize because of the many nodes and the great overlap. Also the original set leaves out many visualization details such as grouping, size and clustering.

Did you use a subset of the data? If so, what was it?

No, I used the full data set as available from this link.

Are there any particular aspects of your visualization to which you would like to bring attention?

To improve the visualization and make it more clear:

  • Colors (Hue,): I've used colors to indicate which conferences the nodes belong to. The colors corespondent to the colors as seen in the legenda on the right.
  • Labels: The labels are left out initially to avoid an over crowded graph. You may hoover the nodes to see the college and how many opponents they have (not available on screenshot).
  • Clustering: All nodes are clustered by conferences, all nodes of the same conference are drawn in the same area.
  • Node sizes : Another visual enhancement this graph has are the node sizes. Small nodes have played less games, larger nodes play more.

The legenda is made interactive:

  • You can toggle the visibility of clusters by data by clicking on the desired zone. By enabling clusters you can see if colleges tend to play each other or more outside of their conference.

The chart is made interactive:

  • Hovering a node will show the college name and total links it has.
  • Hovering a node will highlight and color the links to it's linked nodes.
  • Hovering a node will temporary enlarge a node.

By using density, saturation, hue, color, area, length, interaction and filters it allows the user to understand the data quite better then the original graph.

What do you think the data and your visualization show?

  • Colleges on the outer edge of their cluster are less likely to play colleges from other clusters then their peers facing the center.
  • LouisianaTech, Western Athletic (most center of graph) plays games against various conferences.
  • Utahstate, Independends, is more likely to play against Mountain West, Pasific Ten and Sun belt.
  • Pittsbourg (the purple node in the red cluster), is has played more Mid-American colleges then the rest of the Big East colleges.
  • Pasific ten and Mid-American are less likely to play against each other, as will Atlantic Coast and Big Twelve, since they are on opposite sides.
  • Colleges with colors with conferences "Independents" and "Sun belt" are less likely to play colleges in the same conference. Since their cluster is quite large and they are scattered all over the graph.

Screenshots

Pittsbourgh highlighted Pittsbourgh highlighted

Mid American and Pacific ten are less likely to play vs each other Mid American and Pacific ten are less likely to play vs each other

3

All clusters shown All clusters shown

Independends clusters shown Independends clusters shown

4

5

6

7

Copyright (c) 2016 Antek Drzewiecki

data-visualization-week3-assignment's People

Contributors

antek-drzewiecki avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.