Table

100%

✓ Published1🌍 Public

Last edited Jan 6, 2020

Created on Dec 27, 2019

Forked from US Map

This example displays NBA team statistics in an interactive data table, allowing users to filter the dataset by conference (Eastern or Western) using buttons. The table presents team records, win percentages, scoring averages, and streak data, sorted by wins. Built with D3.js and the jQuery DataTables plugin, the visualization renders an HTML table inside an SVG foreignObject and dynamically updates rows when a filter button is clicked. The underlying team data comes from a CSV file.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Table

This interactive table displays 2018-2019 NBA team statistics, including win/loss records, percentages, and scoring differentials, sorted by wins. Users can filter the data by league conference using the Eastern and Western buttons. The visualization combines a jQuery DataTable with SVG foreignObject rendering to embed an HTML table within a D3 graphic, loading its data from a CSV file and updating the table contents dynamically upon button selection.

JJerfaas

87% match

Loading thumbnail…

NBA Standings Modified

This interactive visualization displays NBA team standings and locations on a U.S. map, with buttons to filter by conference and toggle team labels. It uses D3 v5 (including `d3.geoAlbersUsa`, `d3.geoPath`, and `d3.zoom`) to render states and team markers from CSV data, and provides zoom controls. A DataTables jQuery plugin renders the standings in a sortable table, while D3 transitions and tooltips enhance the experience.

SShubham Yadav

80% match

Loading thumbnail…

Untitled

This interactive bar chart displays NBA team statistics for the 2021 regular season, with eight buttons letting viewers switch between metrics such as field goals made, assists, and rebounds. The visualization uses d3.csv to load data from a GitHub-hosted dataset and renders SVG line and circle marks, where each team’s value is shown as a point on a vertical baseline. The d3 scaleBand and scaleLinear axes update with smooth transitions on button clicks, changing the Y-axis domain to fit the selected statistic while coloring points by conference (Western or Eastern).

LLinhao Yu

76% match

Loading thumbnail…

NBA Standings

This interactive NBA standings visualization displays the geographic distribution of teams on a U.S. map using d3.geoPath with a geoAlbersUsa projection. Hovering over team markers reveals details like wins, losses, and win percentage. Users can filter by conference, toggle labels, zoom using d3.zoom, or switch to a sortable data table built with DataTables, which shows the full statistical standings from the loaded CSV data.

SShubham Yadav

75% match

Loading thumbnail…

Dv2_task2_Stacked Bar Chart

This stacked bar chart displays NBA player performance across 30 teams, showing each player's games played split into wins and losses. A dropdown menu lets viewers switch between teams, updating the bar chart to display that team's roster. The visualization uses React with reusable components for axes and marks, while D3 v5 functions like `scaleLinear`, `scaleBand`, and `scaleOrdinal` handle the data mapping and color encoding. Data comes from a CSV file loaded via D3's `csv` method, rendered as SVG rectangles with hover tooltips showing exact game counts.

NNagateja99

71% match

Loading thumbnail…

EDAV Interactive

This interactive bar chart displays the 2019 NBA win totals for all 30 teams, ordered from highest to lowest, with tooltips revealing exact values on hover. Built with the D3.js v5 framework (via APIs like `d3.csv`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisBottom`), the visualization uses SVG rects for bars and animated hover effects—highlighting the bar in green and showing a tooltip—to emphasize the gap between top teams like Milwaukee (56 wins) and bottom teams like Golden State (15 wins). The underlying data is loaded from a CSV file, and the styling uses SCSS variables for consistent theming.

Iiyengarakshay00

71% match

Loading thumbnail…

Nba Data but better

This interactive bar chart visualizes NBA player statistics, letting viewers switch between points, assists, rebounds, and seasons played using dropdown menus. The visualization uses d3.scaleBand and d3.scaleLinear to position bars, with d3.transition animating bar growth and mouseover effects that dim other bars and display a date tooltip. Data loads from a CSV file via d3.csv, while the custom menu component uses d3.dispatch for change events. SVG rendering includes hover opacity transitions and axis updates.

PPhilip Rago

70% match

Loading thumbnail…

Interactive Highlighting Colorful Scatter Plot of NBA 2018-2019 Playoffs with Menu

This interactive scatter plot visualizes NBA 2018-19 playoff player statistics, where each circle represents a player and its position reflects selected attributes like games played or points. Users can switch between different statistical measures via dropdown menus and hover over the team legend to fade other teams, employing d3.scaleOrdinal for color mapping and d3.scaleLinear for axes. The plot uses React with D3 v5 for rendering SVG marks, and data comes from a Kaggle basketball dataset, filtered for playoff performance.

ZZiyang Gao

70% match