Fork of DataViz All together

100%

Fork of DataViz All together

✓ Published0🌍 Public

Last edited May 30, 2022

Created on May 30, 2022

A fork of an earlier NBA data visualization, this web application presents annual wildfire statistics as an interactive bar chart. A dropdown menu allows the user to select a year from 2001 to 2015, and the chart updates to show the number of wildfires by fire size class for that year, with each bar color-coded by a specific cause (e.g., debris burning, lightning). The visualization is built with React and D3, using `scaleBand` and `scaleLinear` for axes, `scaleOrdinal` for the color legend, and `csv` to load data from a remote GitHub repository. The rendered SVG includes a tooltip on each rectangle to reveal the precise count.

AI-generated description

Description:

The bar chart visualizes the NBA Player State Dataset. It iterates the previous version, which is designed to depict LAL players score per game in 2020-2021 season. A horizontal line is depicted in the chart to emphasize the mean score.

Representations:

X-axis: Player's name
Y-axis: Games played
Bar: Each bar represents a player in the team.
Interaction: Choose the team with the dropdown menu

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of DataViz All together656565

This interactive dashboard visualizes wildfire statistics from a CSV dataset, showing the number of wildfires by fire size class for each year from 2001 to 2015. Users select a year through a dropdown menu or range slider, which updates stacked bar charts rendered with SVG rectangles in React. The visualization uses D3 scales (scaleBand, scaleLinear, scaleOrdinal) and includes a color legend to distinguish fire causes such as debris burning, lightning, and miscellaneous sources. A secondary zoomable bubble chart, built with react-bubble-chart, displays legend data with hover effects.

GGorbonosov Ilya

93% match

Loading thumbnail…

Fork of DataViz All together43432

This interactive bar chart uses the D3.js library within a React framework to visualize wildfire data by fire size class across different years. A dropdown menu allows viewers to select a specific year, and a color legend distinguishes the causes of fires, such as debris burning, lightning, and arson. The chart includes axes created by custom React components and renders SVG rectangles, with a D3 transition animation implemented through a slider to explore changes over time. Data is loaded from a CSV file using D3's `csv` function.

GGorbonosov Ilya

93% match

Loading thumbnail…

Fork of DataViz All together

This interactive dashboard combines a stacked bar chart, a choropleth map, and a zoomable bubble chart to explore wildfire data across U.S. states from 2001 to 2015. Users select a year via a React dropdown, updating a bar chart that breaks down fire size classes by cause using `scaleOrdinal` and `scaleBand`. A separate map uses `d3.geoRobinson` and `d3.geoPath` to color regions by total fire size, with click-to-zoom functionality. The visualization relies on React for state management and D3 v5 for scales, axes, and geographic rendering, sourcing data from a CSV file.

SStefan Pushkov

90% match

Loading thumbnail…

Fork of NBA Player Games Played Bar Chart

This bar chart visualizes wildfire counts by fire size class across different years, using data from a public GitHub dataset. Each bar represents a fire size category, with stacked segments showing the number of fires attributed to different causes, including arson, lightning, and equipment use. Users can select a year from a dropdown menu to update the chart. The visualization is built with React and D3 v5, using `scaleBand` for the x-axis, `scaleLinear` for the y-axis, and `scaleOrdinal` for the color legend, all rendered as SVG elements.

AAndrey Getmanov

85% match

Loading thumbnail…

DataViz All together

An interactive dashboard combines a stacked bar chart with a bubble chart to explore wildfire causes across U.S. states from 2001 to 2015. The bar chart, built with React and D3 v5, uses `scaleBand`, `scaleLinear`, and `scaleOrdinal` to show the number of wildfires by fire size class, segmented by cause including debris burning and lightning, with a dropdown menu filtering by state. A separate bubble chart visualizes the total acres burned by cause using a d3.pack layout. Data comes from a CSV file of wildfire statistics.

AAndrey Getmanov

85% match

Loading thumbnail…

Fork of Fork of HTML Starter

This interactive scatter plot visualizes wildlife data, mapping animal weight, altitude, population density, and temperature. The visualization cycles through different x-axis variables every second, allowing dynamic exploration of relationships between ecological metrics. Built with D3 v6, it uses scalable vector graphics (SVG) rendering with ordinal symbol scales to distinguish habitats, while circle sizes encode age-specific differences. The code implements reusable chart functions with configurable accessors, and animates transitions by updating scales and redrawing marks. Data originates from a CSV file loaded via D3’s CSV parser, with axes and symbols rendered using D3’s scale and shape generators.

NNandini Maddula

78% match

Loading thumbnail…

Fork of FEMA Disaster Data Visualization : Interactive Viz

This interactive visualization displays FEMA disaster declarations, allowing viewers to switch between bar charts of disasters by state, line charts over time, and pie charts of disaster types. Users can filter by year and hover to see tooltips; clicking a bar drills into a state-specific pie chart. The D3.js v7 code loads remote CSV data, uses `d3.rollup` for aggregation, and renders SVG with scales, axes, and ordinal color schemes.

NNita

78% match

Loading thumbnail…

Fork of React & D3 Vibecoding Starter

This is an interactive bar chart that visualizes the frequency of letters in a dataset loaded from a local CSV file. The chart uses SVG bars with rounded corners and a color gradient, where clicking a bar toggles a selected state that highlights the bar and dims others. Built with React and D3 v7, it uses `scaleBand`, `scaleLinear`, `axisBottom`, and `axisLeft` to create the scales and axes, with a `ResizeObserver` in a custom `useDimensions` hook to make the visualization responsive.

Aankitgoudpoodhari07@gmail.com

77% match