Skip to main content
SimilarExport ZIP
100%

Project Momentum - Sitanshu Rupani

✓ Published0🌍 Public
SSitanshu Rupani
Last edited Oct 14, 2021
Created on Oct 14, 2021

This interactive scatterplot explores player attributes from a FIFA 19 English Premier League dataset. Users select X and Y axes from metrics like Potential, Overall, Dribbling, and Acceleration, and filter data by Preferred Foot, Nationality, or Club. The visualization uses React with d3.scaleLinear for axes and d3.scaleOrdinal for coloring, rendering marks as SVG circles. A color legend highlights specific filter categories on hover, fading other points to emphasize the selection.

AI-generated description

This viz is a progression for graph 2 of my final project.
Some changes seen here, include improvements to the font and general look and feel of the graph.
I have improved upon the interactions and added a third dropdown with which a user can slice the data based on 3 filters, Preferred Foot of the player, the club he plays for and his nationality.

The data for this viz can be found here: FIFA 19 Players Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Test2

This interactive scatter plot visualizes player attributes from the FIFA19 English Premier League dataset, allowing users to compare quantitative metrics like Potential, Overall, Dribbling, and Acceleration via dropdown menus for both x and y axes. Built with D3 v6, it uses `scaleLinear` for quantitative axes and `scalePoint` for categorical positions, rendering circles with SVG and animating transitions using the `transition` API. The visualization updates smoothly with a 1000-millisecond duration, using data fetched from a GitHub gist.

SSitanshu Rupani
83% match
Loading thumbnail…

Adding Interaction for Scatter Plot - FIFA19 Players Dataset - Sitanshu Rupani

This interactive scatter plot visualizes player attributes from the FIFA19 English Premier League dataset, allowing users to dynamically select which quantitative or categorical attributes appear on the x- and y-axes via dropdown menus. The D3 v6 code uses `scaleLinear` and `scalePoint` for numeric and categorical mappings, with axes rendered through `axisLeft` and `axisBottom`. Data points are drawn as SVG circles with opacity, and transitions animate position changes and circle growth over 1000 milliseconds when axes change. The dataset is loaded as CSV from a GitHub Gist.

SSitanshu Rupani
82% match
Loading thumbnail…

D3 Scatter Plot - FIFA Dataset - Sitanshu Rupani

This visualization shows a D3.js scatter plot comparing FIFA 19 player potential against their current overall rating, using data from a public gist of the FIFA19 English Premier League dataset. Each circle represents a player, plotted with potential on the x-axis and overall on the y-axis. The code uses d3.csv for data loading, d3.scaleLinear for both axes, and d3.axisLeft and d3.axisBottom to render the axes. The SVG-based chart fills the full browser window and applies a fixed radius of five pixels to all data points.

SSitanshu Rupani
81% match
Loading thumbnail…

Address Project Feedback - Sitanshu Rupani

This scatterplot visualizes the relationship between FIFA 19 players’ overall ratings and their weekly wages, using D3.js v4 with SVG rendering. It plots each player as a circle, with data sourced from a CSV of English Premier League players. Users can brush over the plot to highlight specific players, which triggers a table below showing their name, club, nationality, and potential. The visualization uses `d3.brush()` for selection, `d3.axisBottom` and `d3.axisLeft` for axes, and `d3.scaleLinear` for positioning, dynamically updating the table via `d3.selectAll('.brushed')`.

SSitanshu Rupani
80% match
Loading thumbnail…

Make Something with Brushing - Sitanshu Rupani

This visualization uses a scatterplot to show the relationship between Overall and Potential ratings for FIFA 19 English Premier League players. Users can brush an area of the plot with d3.brush, which highlights selected circles in pink while dimming others, and upon releasing the brush, a table appears listing the player names, Overall, and Potential values for the brushed points. The plot is rendered with SVG, using d3.csv to load the dataset and d3.scaleLinear for axes.

SSitanshu Rupani
78% match
Loading thumbnail…

Scatter Plot with Menus

A scatter plot displays football player statistics across six attributes (ARG, BRA, ESP, FRA, GER, ITA) from a FIFA dataset. Two dropdown menus let viewers independently select which attribute appears on the x- and y-axes, with react state managing the selection. The code uses d3.scaleLinear for scales, d3.extent for domains, and d3.csv to load data, rendering circles as SVG marks with tooltips via the title element. Axis components generate ticks with tick formatting using d3.format.

NNikithakatta30
78% match
Loading thumbnail…

Dashboard - Final Project - FIFA 19 Dataset

This dashboard explores the FIFA 19 dataset, integrating a world map with bubble markers, a Sankey diagram, and a scatterplot to reveal player distributions. The map uses `d3.geoNaturalEarth1` and `d3.geoPath` with topojson data, scaling circle radii by player count. The Sankey chart, built with the `d3.sankey` layout, visualizes flows from nationality to club. The scatterplot displays player overall rating against wage, supporting brush-based selection to highlight individual players.

SSitanshu Rupani
76% match
Loading thumbnail…

Viz_9

This interactive scatter plot displays FIFA player statistics across six national teams (ARG, BRA, ESP, FRA, GER, ITA), letting users compare any two attributes via dropdown menus. The visualization uses React with D3 v5 scales (d3.scaleLinear) to map data to SVG circles, with tooltips showing x-values. Data loads from a CSV via d3.csv. Users can dynamically switch axes, and the plot renders with custom axis components and formatted tick labels using d3.format.

NNikithakatta30
75% match