Question2_Activity7.1

100%

Question2_Activity7.1

✓ Published0🌍 Public

Last edited Nov 5, 2024

Created on Nov 5, 2024

This is an area chart showing air quality levels over time, displaying two overlapping translucent regions for PM2.5 and PM10 particulate matter concentrations. The visualization uses D3.js v3 with SVG rendering, employing `d3.svg.area()` to construct the filled paths against a time-scaled x-axis via `d3.time.scale()`. Data is loaded from a GitHub-hosted CSV using `d3.csv()`, with dates and times parsed into a unified timestamp. The chart includes a dark blue heading, green axis tick labels, and a blue y-axis label indicating units of µg/m³.

AI-generated description

This is an area chart

MIT Licensed

Similar vizzes

Loading thumbnail…

Question 2

This interactive D3.js visualization displays PM2.5 air pollution levels in India, separated by year. The SVG chart animates a line and area graph of pollutant concentrations, with color-coded bands indicating air quality categories from "Good" to "Hazardous." Users select years via clickable buttons, triggering a transition that redraws the data. The tooltip reveals exact values and health status on hover, with data loaded from a CSV file hosted on GitHub Gist.

Bbhavanasruthikakarlapudi@gmail.com

84% match

Loading thumbnail…

Activity 6 Question 3

This scatter plot displays the relationship between PM2.5 air quality levels and the number of health complaints across eight dates in March 2023. Each point’s shape and color encode a severity level: circles represent level 1 (green), triangles level 2 (orange), and squares level 3 (red). The visualization uses D3 v6 with an SVG renderer, employing `d3.scaleLinear` for both axes, `d3.axisBottom` and `d3.axisLeft` for tick marks, and `d3.symbol` with a `shapeMap` to generate distinct point glyphs. The data is hardcoded in the script as a constant array.

BBharath Vupputuri

80% match

Loading thumbnail…

Activity-9_Question-2

This example shows an area chart of temperature over time, with a filled region beneath a line that maps date to temperature readings. The visualization uses D3 v5 to load a CSV dataset from a gist, parse dates with `d3.timeParse`, and create the chart with `d3.area` and `d3.scaleTime`/`d3.scaleLinear`. It renders to an SVG via a `path` element, styled with a categorical color scheme, and includes labeled x- and y-axes using `d3.axisBottom` and `d3.axisLeft`. The data source is a remote CSV file, and the chart displays the unlabeled series with a single filled area.

Hharipadmavathim2023@gmail.com

80% match

Loading thumbnail…

Activity7.1_Question2

This area chart visualizes global CO₂ emissions over time. The graphic fills the space beneath the line with green, making the upward trend in emissions immediately visible against the chart's white background. The visualization is built with D3 v7, using the `d3.area` API to generate the shape and `d3.scaleLinear` for axis scaling. Data is loaded from a remote CSV file via `d3.csv`, and the final SVG is rendered with standard D3 axes, labels for "Year" and "CO₂ Emissions," and a clean sans-serif font.

SSai Praveen Lokavarapu

79% match

Loading thumbnail…

Activity_6 Question4

This bubble chart displays the relationship between average PM2.5 levels, average NO2 levels, and population across global cities. The visualization positions each city as a circle along x- and y-axes for the two air quality metrics, while circle size encodes population using d3.scaleSqrt. The chart draws SVG circles with d3.scaleOrdinal color mapping per city, and loads data from a GitHub-hosted CSV via d3.csv. Axes are generated with d3.axisBottom and d3.axisLeft, and the rendering includes labeled axes, stroke outlines, and 0.7 opacity for overlapping bubbles.

JJaiyaGhanta@my.unt.edu

79% match

Loading thumbnail…

Activity7.1_Question2

This visualization displays global CO₂ emissions over time as a green area chart, with the x-axis representing report years and the y-axis showing carbon output. The area chart is rendered using D3.js v7’s `d3.area()` generator, which fills the space between the line and the baseline. Data is loaded asynchronously via `d3.csv()` from a GitHub Gist, then mapped to linear scales (`d3.scaleLinear`) for positioning. Axes are added with `d3.axisBottom` and `d3.axisLeft`, and the SVG output is styled with a simple external stylesheet.

Ssagipavan2385@gmail.com

79% match

Loading thumbnail…

Activity_7.1_Question2

This visualization shows two area series representing session rates over time, allowing direct comparison of the two metrics on a shared time axis. Built with D3.js version 3, the chart uses SVG rendering and separate area paths with distinct colors (limegreen and orangered) at 50% opacity. Data is loaded from a remote CSV file, parsed using `d3.csv` with custom type conversion, and mapped to time and linear scales (`d3.time.scale`, `d3.scale.linear`). Axes are generated via `d3.svg.axis`, while the areas are created with `d3.svg.area`, each anchored to the chart’s baseline.

Vvarshithainaganti@gmail.com

79% match

Loading thumbnail…

Untitled

This visualization shows London’s monthly air quality data from 2010–2018, displaying PM2.5 and PM10 particulate levels as a multi-line chart. A dropdown menu lets users select different pollutant measures, while a color legend indicates measurement year. The visualization uses D3.js v3 to render SVG graphics, with animate transitions on the line paths. Data originates from the Kings College London Air Quality Dataset, and the code relies on D3’s `scaleTime`, `scaleLinear`, `nest`, and `line` functions for time-series rendering. Axis helpers like `axisBottom` and `axisLeft` structure the plot.

KKeerthiKandadai

78% match