Line Chart

100%

✓ Published0🌍 Public

Last edited May 15, 2023

Created on May 15, 2023

This line chart displays the median PM 2.5 concentration for each month of the year, using a smooth basis curve to connect data points. The visualization, built with D3 v5, employs `scaleLinear` for both axes and `axisBottom`/`axisLeft` for tick marks. Data is loaded via `csv` from a GitHub gist, with month names converted to numbers. The chart includes labeled axes for "Month" and "Median PM 2.5 Conc," rendered as an SVG with a styled path.

AI-generated description

This line chart shows one week of temperature (in degrees Celcius) in San Francisco. The data comes from Data Canvas - Sense Your City.

Made in this video:

MIT Licensed

Similar vizzes

Loading thumbnail…

Median PM2.5 daily concentration

This line chart visualizes median PM2.5 daily concentration across months, with a smooth curve connecting data points. The y-axis measures concentration levels, while the x-axis represents months from January through December. Built with D3 v5, the code uses `scaleLinear`, `scaleTime`, `axisLeft`, `axisBottom`, and `line` with `curveBasis` to generate the SVG path. Data is loaded from a CSV file hosted on GitHub Gist, and the chart includes styled grid lines and axis labels. The rendering approach uses an SVG element with margins defining the plotting area.

Llibramanju

91% match

Loading thumbnail…

ICE7 Line Chart

This line chart displays the median PM2.5 concentration for each month in San Francisco, with the x-axis representing months and the y-axis showing concentration values. The visualization is built using D3 v5, specifically employing `scaleLinear`, `axisLeft`, `axisBottom`, and a `line` generator with `curveBasis` for smooth interpolation. The chart includes labeled axes for "Month" and "Median PM 2.5 Conc," with data loaded from a CSV file hosted on GitHub. The SVG rendering uses a blue line with a title and grid lines, styled via CSS.

Llibramanju

81% match

Loading thumbnail…

Fork of ICE7 Line Chart

This line chart visualizes the median PM 2.5 concentration across different age-group bands, with data loaded from the Gray Area Foundation's "Data Canvas - Sense Your City" initiative. The visualization uses the D3 v5 library, specifically leveraging `select`, `csv`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with a basis curve to render a smooth SVG path. The chart includes labeled axes for "Month" and "Median PM 2.5 Conc," with a blue stroke styling for the plotted line.

VVineela Reddy

80% match

Loading thumbnail…

Multiple Line plot

This visualization displays monthly average PM2.5 particulate concentrations in London from January 2010 through August 2018, using nine separate colored lines to represent each year. The chart includes a World Health Organization guideline line at 10 µg/m³, with a dropdown menu and color legend for reference. Built with D3 v5, the visualization uses SVG rendering and implements d3.nest, d3.scaleTime, d3.line with curveBasis, and custom reusable components for the dropdown menu and color legend. Data comes from the Kings College London Air Quality Dataset in the London Datastore.

KKCachel

79% match

Loading thumbnail…

Fork of ICE7 Line Chart

This line chart displays median PM 2.5 concentrations across months in San Francisco, using data from Data Canvas - Sense Your City. The visualization plots a smooth curve through monthly data points, with labeled axes for month and concentration. Built with d3 v5, the chart uses d3.line with curveBasis for the smoothed path, d3.scaleLinear for both axes, and d3.axisLeft and d3.axisBottom for tick marks. The SVG rendering includes gridlines, axis labels, and a title, with styling applied via CSS classes.

SStruan Bowie

79% match

Loading thumbnail…

Multiple Line plot

This visualization displays London’s monthly average PM2.5 particulate levels from 2010 through 2018, drawn from the Kings College London Air Quality Dataset in the London Datastore. Nine colored lines, one per year, show seasonal patterns using smooth curves generated with d3.line and curveBasis. The code uses d3.scaleTime for the x-axis, d3.scaleLinear for the y-axis, and d3.scaleOrdinal for the color legend. SVG rendering supports the chart and interactive dropdown menu.

CCurran Kelleher

79% match

Loading thumbnail…

Multiple Line plot

This visualization presents a multiple line plot tracking monthly PM2.5 particulate levels in London from 2010 through 2018, with each year rendered as a separate colored line. The chart uses D3 v5 to build SVG paths with a smoothed curve basis, displaying data from the Kings College London Air Quality Dataset. A color legend identifies each year, while the y-axis scale is derived from the 2011 data values. The visualization includes static axes and axis labels, with all nine yearly lines drawn simultaneously on a dark background.

Jjblaskovich

79% match

Loading thumbnail…

Fork of ICE7 Line Chart

This line chart visualizes the median PM 2.5 concentration for each month in San Francisco, using data from Data Canvas - Sense Your City. The chart renders as an SVG using d3.v5, with a smoothed line generated by the `line` and `curveBasis` functions, and axes created via `scaleLinear`, `axisBottom`, and `axisLeft`. A CSV file is loaded with `csv` and processed to convert month names into numeric indices. The chart includes labeled axes, a title, and a blue line path styled via CSS.

SSólveig Hákonardóttir

78% match