PM Emissions in the Metropolitan City of Cagliari

100%

PM Emissions in the Metropolitan City of Cagliari

✓ Published1🌍 Public

Last edited Jan 15, 2022

Created on Dec 1, 2021

Forked from PM 2.5 Emissions in the Metropolitan City of Cagliari

This visualization displays daily average PM 2.5 and PM 10 emissions across multiple monitoring stations in the Metropolitan City of Cagliari. The chart shows time series lines with a dashed World Health Organization threshold line, using a Voronoi overlay via `d3.Delaunay` for hover detection. React manages state for pollutant selection and tooltips, while D3’s `scaleTime`, `scaleLinear`, and `line` handle scaling and path generation. Data comes from a CSV of daily emissions, rendered with SVG.

AI-generated description

A Voronoi-based chart to display the data about PM emissions in the Metropolitan City of Cagliari.

MIT Licensed

Similar vizzes

Loading thumbnail…

PM Emissions in the Metropolitan City of Cagliari, multilanguage

A multi-line chart displays daily average PM2.5 and PM10 emissions from monitoring stations in the Metropolitan City of Cagliari, alongside a dashed WHO threshold line. The visualization supports English, Italian, and Sardinian text. Built with React and D3, it uses `d3.csv` for data loading, `d3.scaleTime` and `d3.scaleLinear` for axes, and a Voronoi overlay for interactive tooltips on hover, highlighting values above the threshold.

AAndrea Picciau

94% match

Loading thumbnail…

PM 2.5 Emissions in the Metropolitan City of Cagliari

This chart displays daily PM2.5 emissions from multiple monitoring stations in the Metropolitan City of Cagliari, using a logarithmic y-scale to accommodate wide value ranges. A dashed threshold line marks the WHO guideline of 25 μg/m³, with tooltips showing each station’s value and its percentage above or below this limit. The visualization relies on React components and D3 v7, employing `d3.scaleLog`, `d3.line`, and `d3.Delaunay` for Voronoi-based hover detection. Hovering over any point highlights the corresponding station’s full time series in color.

AAndrea Picciau

93% match

Loading thumbnail…

PM2.5 For Selected Country

This visualization shows the annual PM2.5 air pollution trend for a selected country from 2010 to 2017, with the user choosing the country via a dropdown menu. It uses D3 v5 with React, rendering an SVG line chart with axes, a color legend, and a title. The data comes from a Kaggle dataset on global air pollution, processed and structured per country. Key APIs include `d3.csv`, `scaleLinear`, `line`, `nest`, and `axisBottom`.

PPakcheera Choppradit

74% match

Loading thumbnail…

PM2.5 Around the World

This visualization combines a choropleth map and line chart to explore global PM2.5 air pollution levels from 2010 to 2017. A slider selects the year, updating the map's color shading and highlighting the corresponding point on the time-series chart. Built with D3 v5, it uses `d3.geoPath` with a Natural Earth projection for the map and `d3.scaleLinear` for chart axes. The data comes from a Kaggle dataset of mean annual PM2.5 exposure for 240 countries, with missing values shown via a diagonal hatch pattern.

Rrioto9858

74% match

Loading thumbnail…

PM2.5 For Selected Country

A multi-line chart displays PM2.5 air pollution values per year for a selected country, drawn as SVG paths using D3 v5 within a React framework. A dropdown menu lets the viewer choose a country, triggering a redraw of the line chart and its color legend. The visualization uses d3.line, d3.curveBasis, d3.scaleLinear, and d3.scaleOrdinal, with data loaded from a CSV via d3.csv and processed into yearly series.

PPakcheera Choppradit

72% match

Loading thumbnail…

PM2.5 For Selected Country

This visualization displays PM2.5 air pollution trends for a selected country from 2010 to 2017 using a multi-line chart. A dropdown menu allows users to switch between countries, updating the line path to show that nation’s annual mean exposure values. The code uses D3 v5 with React, employing `d3.line`, `d3.scaleLinear`, `d3.axisLeft`, `d3.axisBottom`, and `d3.nest` to process and render the data. It also uses a custom `colorLegend` component and `foreignObject` for the dropdown UI. Data originates from a Kaggle dataset loaded via a Gist URL.

Iivaleehan

72% match

Loading thumbnail…

PM2.5 For Selected Country

A line chart displays PM2.5 pollution trends for a selected country from 2010 to 2017, with country choices via a dropdown menu. The visualization loads CSV data from a Kaggle dataset and processes it with d3.csv, then renders an SVG using D3 v5’s scaleLinear, axisBottom, axisLeft, and line with curveBasis. A color legend, generated via a custom colorLegend function using scaleOrdinal and schemeCategory10, shows the selected country’s line color. React dropdown styling is referenced, though rendering relies directly on D3 selections.

Rrioto9858

72% match

Loading thumbnail…

PM2.5 Around the World

This interactive visualization displays PM2.5 air pollution levels for countries worldwide from 2010 to 2017. A choropleth map, rendered using d3.geoPath and d3.geoNaturalEarth1, color-codes each country by its annual mean PM2.5 concentration. Users can select a year via a slider, which updates both the map and a line chart showing pollution trends for all countries. Hovering or clicking a country highlights its data in red on the line chart. The data is sourced from Kaggle's PM2.5 Global Air Pollution dataset.

Rrioto9858

72% match