md ` We chose to visualize FiveThirtyEight's NBA Elo predictions as an extension of Hussein's and Shawn's previous work. The first idea that we explored involved recounting the history of the NBA through upsets, wherein we visualized each game where a heavily favored team was defeated.

These upsets would have been arranged in a grid, allowing the user to explore all of the upsets in a given season. Mousing over individual circles would have revealed information about the individual games and the corresponding team records.

Although we felt that the experience of exploring the NBA's past was an engaging aspect of this visualization, we believed that the possibilities for meaningful interactivity were somewhat limited. Seeking to create an experience of NBA history with greater user participation, we settled on this interactive map of NBA team Elo through time. The distribution of work was broadly divided as follows: * **Shawn** designed the individual team circles, implemented their interactive behavior, and created the accompanying line graph. * **Hussein** added the US map to the visualization and worked on projecting the team locations. Additionally, he implemented the interactive slider and the smooth transitions in circle radius. * **Zifang** solved our lingering projection issues and worked on the implementation of the tooltips. She also incorporated data about win-loss records into the dataset. * **Harry** aggregated team color, logo, and geographic information into the dataset. Additionally, he worked on improving the visibility of the visualization. Most of our design challenges were related to the coherent display of the team locations on the US map. With many teams clustered close together, we had the issue of dominant teams obscuring their neighbors. This was a primary concern from our user studies, with all participants indicating that the circle overlap was a defect of the visualization. We were able to improve this issue by adding transparency to other circles when mousing over one of interest and by slightly adjusting the locations of the circles from their true positions. We believe that the legibility of the visualization is a more important feature than complete accuracy of team location, although we acknowledge that this might be a confusing tradeoff for users who are generally unfamiliar with the NBA teams. User studies also revealed that the concept of "Elo" was generally unfamiliar. Although we clarify this with a brief blurb, we feel that it would help to have an interactive explanation. Given another week, we would implement a widget that allows the user to explore the relationship between the Elos of two teams and the probabilities of either team winning. The following is a collection of datasets and resources we used in this project:

Dataset by FiveThirtyEight (1946 - 2015) ---> (Dataset 1) https://github.com/fivethirtyeight/data/tree/master/nba-elo
Used Pandas to Process Dataset 1 (1980 - 2015) ---> (Dataset 2) https://gist.githubusercontent.com/shpach/c4af6237cb34a7b04d5c44fec17a3491/raw/a186c3274c243ac915b3aa032c12430b4e8cad06/avg_nba_elo.csv?fbclid=IwAR1IUF6msbxuimC9dlaM9EfdIEdNOluUEJQ8MQ-qKYbwa7B1BKNYblcOn-w
Added NBA Team Geographic Coordinates and Primary Colors ---> (Dataset 3) https://raw.githubusercontent.com/sharry29/DataViz/master/misc/nba_colors.csv
Joined Datasets 2 and 3 ---> (Dataset 4) https://raw.githubusercontent.com/sharry29/DataViz/master/misc/avg_elos_with_pos_color.csv
Added NBA Team Logos ---> (Dataset 5) https://raw.githubusercontent.com/sharry29/DataViz/master/misc/logos/ + "team_id" + ".png"
Formatted Every Team's Average Elo Rating per Year as JSON Object for Line Chart (1980 - 2015) ---> (Dataset 6) https://gist.githubusercontent.com/shpach/ff6baa0f8c1a607ed8959f49d797e9b8/raw/af766ca4e2ca680a48c101ad1155706449300abd/team_data_series.json
Credits to Jane Pong for Slider Template https://bl.ocks.org/officeofjane/47d2b0bfeecfcb41d2212d06d095c763
Credits to Noah Veltman for Map Template https://beta.observablehq.com/@veltman/inner-glow
Credits to Mike Bostock for Multi-Line Chart Reference https://observablehq.com/@d3/multi-line-chart `