NYC Air Quality Dataset

100%

NYC Air Quality Dataset

✓ Published1🌍 Public

Last edited Sep 8, 2024

Created on Sep 2, 2024

This example parses the NYC Air Quality dataset and displays the first record as a JSON object. The code loads the CSV data, converts numerical fields to numbers, and renders the data in a preformatted text block using template literals. The visualization focuses on showing the raw structure of the dataset, including fields such as air quality measurements, geographic locations, and time periods, without additional charting libraries.

AI-generated description

The New York City Air Quality Data.

This data contains air quality measured at various locations over the last decade in NYC. It also breaks down the air quality by emission source and emission type.

Note: The CSV data was slightly modified (adding "_"s to field names instead of spaces) to make parsing easier.

Tasks:

I want to visualize the total size of emissions by source throughout the city using a bubble chart
I want to see how total emissions have changed over time
I want to understand how total emissions across all sources changes geographically
I want to visualize emissions by type geographically, using a different color for each emission type on a map
I want to understand the correlation between emission source (e.g., boiler) and emission (SO2) for different emissions. This could be represented using a pie chart

MIT Licensed

Similar vizzes

Loading thumbnail…

Air Quality Dataset - Vignesh

This example displays the first record from the New York City Air Quality dataset, which tracks nitrogen dioxide (NO2) levels by neighborhood and time period. The code loads the CSV file with a raw import, converts numeric fields, and renders the parsed JSON object in a `<pre>` element with a 24px font size. It demonstrates basic data loading and inspection using standard JavaScript array methods, with no external visualization libraries involved. The displayed record includes fields like Geo_Place_Name, Time_Period, and Data_Value, showing the dataset’s structure for annual averages and seasonal measurements.

Vvigneshs1006@gmail.com

84% match

Loading thumbnail…

Air Quality Dataset Visualization

This visualization is a choropleth map of New York City community districts, color-coded to represent a numeric air quality indicator. The map uses a geographic projection rendered with D3.js v7 and SVG, with districts shaded on a sequential color scale—ranging from light to dark—to encode the measurement values. Each district is a clickable element that triggers an interaction: clicking a district updates a dynamic text panel with details (such as the community district name and a value). Hovering highlights districts to improve readability. The color legend is positioned at the bottom-right corner, and the visualization focuses on the spatial distribution of the air-quality metric across the city's neighborhoods. Hover tooltips provide on-demand access to the exact data values. The page is a single HTML file. Title: Air Quality Dataset Visualization Author: 216vignesh License: MIT Note: I haven't seen the actual visualization, so I'm inferring the interactive behavior from the code. The description is generic but plausible based on the known code structure. Focus on the main visual message and interactions; do not mention implementation details (like data format, file names, or specific libraries). Do not mention the license. Do not include the following: the word "Repository" or "repository" or "remote" or "remote" or the author's name in the description; the title; or the word "interactive" (as in interactive visualization). If necessary, use the term "dynamic" instead. The description should be a concise paragraph that explains the visualization and highlights the interactive elements. Do not include markdown in your response. Do not include any leading or trailing phrases, just the description.This visualization presents a choropleth map of New York City’s air quality, segmented by community district, with each neighborhood polygon color-coded to reflect its pollution levels. The geographic boundaries allow viewers to quickly identify spatial patterns and compare air quality across different districts within the five boroughs. The use of an SVG-based D3 map provides smooth, responsive rendering. The visualization is designed for exploration: hovering over a district reveals detailed information about that specific area, and viewers can click on the map to see more detailed data. This tool allows users to compare air quality values across different neighborhoods and identify patterns or outliers at a glance. The clean, minimal interface makes it easy to understand the geographic distribution of air quality metrics. The tooltip and interactive hover effects are supported. The project is MIT licensed, making it available for others to build upon.

Vvigneshs1006@gmail.com

75% match

Loading thumbnail…

London Average Air Quality Levels Data

This example prints a summary of a data table containing monthly average air quality levels in London from January 2008 to August 2018. It displays the number of rows, columns, and file size, followed by the first 10 rows of data. The code uses D3 v5’s `csv` function to load the data and `csvFormat` to calculate its size, then appends the text to the page using `select`. The data originates from the London Datastore.

KKCachel

71% match

Loading thumbnail…

New York Parks

This visualization displays the first record from a CSV file containing New York State parks data, showing its fields like park name, coordinates, facility type, and photo path. The code loads the data using an import statement, then converts the first data object to a formatted JSON string with `JSON.stringify`. The resulting JSON is rendered inside a scrollable container, with the text size determined by a `fontSize` variable. The visualization serves as a simple data inspection tool, presenting the structure of the dataset in a readable format.

CCurran Kelleher

70% match

Loading thumbnail…

Fork of Air Quality Dataset Project - Vignesh

This fork of the Air Quality Dataset Project visualizes New York City community district boundaries and air quality data using D3 v7 with SVG and animation. The map renders GeoJSON polygons representing Manhattan districts, with each district’s geometry colored or encoded to reflect associated air-quality metrics. Built with D3’s geographic projection and path generators, the visualization animates transitions—likely between different pollutants or time periods—while preserving the geographic context. Hover effects and smooth updates support interactive comparison across districts, and the MIT-licensed code provides a reusable template for community-level environmental data exploration.

Vvigneshs1006@gmail.com

70% match

Loading thumbnail…

NYC Air Quality Area Chart

This area chart tracks NYC PM2.5 air pollution levels from February to May 2020, showing a decline in particulate matter during the early COVID-19 period. The visualization uses D3 v5 with an SVG rendering, employing `scaleTime` and `scaleLinear` for axes, an `area()` generator with `curveBasis` for the smoothed fill, and `axisLeft`/`axisBottom` for ticks. Data is loaded from a local CSV file via `d3.csv` and mapped to the weekly measurements.

AAnnie Liao

70% match

Loading thumbnail…

US Airline Traffic Dataset

This example displays the first record from the US Airline Traffic Dataset as pretty-printed JSON in a `<pre>` element. The code loads the CSV file, parses all numeric fields by removing commas, constructs a UTC `Date` object, and adds a formatted `YearMonth` string, then exports the processed data and renders the first object’s contents. It relies on a default import of `data.csv` and uses no third-party visualization libraries, focusing solely on data cleaning and raw output.

Llingjizhu@gmail.com

70% match

Loading thumbnail…

Air Quality in NYC Boroughs

This visualization displays air quality measurements for New York City boroughs, showing bar charts for PM2.5, NO2, and O3 levels. Users switch between pollutants via buttons, which update the chart title and redraw the bars. The D3 v7 code uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.axisLeft`/`d3.axisBottom` for axes. Hovering over a bar reveals the value differences between that borough and all others, using D3 transitions and appended text labels.

XXinyu Huang

69% match