Fork of Fork of Fork of Final Project

100%

Fork of Fork of Fork of Final Project

✓ Published1🌍 Public

Last edited Dec 12, 2021

Created on Dec 12, 2021

Forked from Fork of Fork of Final Project

This example visualizes patterns in SO2 emissions across U.S. states and years, using a clickable radio button to trigger an animated view of the data. The visualization employs an SVG-based bar chart built with D3 v6, where each bar represents a state’s emission value for a given year, with colors distinguishing different states. The code leverages D3’s selection and data-join methods to dynamically update the chart, while the embedded dataset contains raw emission numbers formatted with `d3.format`. The animation replays the data sequentially, highlighting changes over time.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of Fork of Final Project

This visualization presents a pattern discovery of SO2 emissions across 31 U.S. states from 2012 to 2021. A radio button triggers an animated horizontal bar chart that displays each state’s annual emissions data. The code uses D3.js v6 to bind data to SVG rectangles, with linear and band scales for positioning. Animated updates remove and redraw the chart, while a color array assigns unique hues to states. The dataset is embedded directly in the script, and the interaction is managed through a simple onclick event handler.

YYi Yang

96% match

Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Final Project

This visualization displays SO2 emissions across 31 U.S. states from 2012 to 2021, using a horizontal bar chart that animates through each year when a button is clicked. The chart encodes emission values with bar lengths, mapping data through d3.scaleLinear for the x-axis and d3.scaleBand for the categorical state labels. Rendered as an SVG with D3 v6, the visualization uses a radio button to trigger the animation, presenting yearly snapshots of pollution data in a compact, color-coded format.

YYi Yang

94% match

Loading thumbnail…

Fork of Fork of Final Project

This example visualizes a multi-state pattern discovery of SO2 emission trends from 2008 to 2018. Clicking a button triggers an animated rendering of the data, which appears as a large SVG area. The visualization uses D3.js v6 to bind data to SVG elements, applying custom colors per state and animating changes through JavaScript function calls. Data is pre-loaded as arrays of monthly average SO2 values for each state, rendered in a static layout with a refresh control.

YYi Yang

92% match

Loading thumbnail…

Fork of Final Project

This visualization displays trends in SO2 concentrations across multiple U.S. states and years from 2008 to 2018. A button click triggers an animated bar chart, with each row representing a different state and each bar showing the yearly average SO2 level. The rendering uses d3.v4 to create SVG elements, with color-coded bars and formatted decimal values. The animation removes existing groups and redraws the chart when activated.

YYi Yang

91% match

Loading thumbnail…

Fork of Final Project

This interactive visualization reveals patterns in air quality data across U.S. states from 2008 to 2018, allowing users to toggle between views of SO2, particulate matter, and NO3 concentrations. The code uses D3.js v6 to render an SVG with animated transitions, mapping state abbreviations along the y-axis and years on the x-axis. Radio buttons trigger distinct animation functions for each pollutant, each displaying differently colored data points with numeric labels formatted using `d3.format`. The visualization employs a React framework and computes aggregated pollutant averages from the embedded dataset.

YYi Yang

89% match

Loading thumbnail…

Fork of Fork of Final Project

This visualization presents a pattern discovery tool for environmental data across US states from 2008 to 2018. Users select between different demographic groups (black, Asian, white) to view animated data representations. The project uses D3.js v6 with React to render SVG elements, featuring radio buttons that trigger different visual states. The code implements custom animations and data manipulation using D3’s formatting utilities, though the specific data source appears to be embedded numerical arrays rather than external files. The visualization employs a multi-year timeline with state abbreviations on the y-axis and floating-point formatted values.

YYi Yang

87% match

Loading thumbnail…

Fork of Fork of Fork of Fork of Final Project

This example visualizes patterns in New York City crime data across 31 offense types from 2012 to 2021. The interface presents a radio button that, when clicked, triggers an animation displaying SO2-related data as an interactive bar chart rendered with SVG. The code uses D3 v6, with methods such as `d3.scaleLinear` and `d3.select`, alongside React for the application framework. The visualization dynamically updates the chart by removing existing groups and redrawing based on user interaction, demonstrating an animated exploration of temporal crime trends.

YYi Yang

85% match

Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Fork of Final Project

This example visualizes yearly counts of New York State penal law violations from 2012 to 2021 as a matrix of numeric values. A button click triggers an animated bar chart display for the SO2 dataset, using D3.js version 6 to bind the data and render SVG rectangles. The visualization applies color-coded bars for each of 31 offense types across 10 years, with transitions that update the chart when the radio button is selected.

YYi Yang

85% match