Fork of ICE7 Line Chart

100%

Fork of ICE7 Line Chart

✓ Published0🌍 Public

Last edited May 11, 2023

Created on May 11, 2023

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.

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…

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

97% 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

93% 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

87% match

Loading thumbnail…

ICE-7 Line Chart

This line chart displays daily temperatures in San Francisco over one week, using data from the Data Canvas - Sense Your City project, with the y-axis labeled "Medals Won" and the x-axis labeled "Year" in the code. Built with D3 v5, the visualization uses d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, d3.line, and d3.extent to render an SVG path with styled tick lines, a green axis label, an orange title, and a purple stroke line. The data is loaded via d3.csv from a GitHub gist URL.

BBhanuMotupalli

84% match

Loading thumbnail…

Fork of ICE7 Line Chart

This line chart visualizes miles per gallon (mpg) for car models, with temperature data from San Francisco sourced via CSV. The chart uses D3 v5’s `scaleBand` and `scaleLinear` for axes, `line` with `curveBasis` for a smoothed path, and `axisBottom` and `axisLeft` for labeled ticks. Data is loaded with `csv` and rendered in SVG via `select`. The chart includes rotated x-axis labels, a title, and axis labels.

NNanditha Reddy

82% match

Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City. It plots temperature in degrees Celsius over time, with a smoothed curve produced using d3.line with curveBasis. The chart uses d3.scaleTime and d3.scaleLinear for axes, rendered with d3.axisBottom and d3.axisLeft. Data is loaded via d3.csv and parsed into Date and numeric values. The SVG output includes labeled axes, gridlines, and a title, styled through external CSS.

JJan Medina

82% match

Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City, with time on the x-axis and temperature in degrees Celsius on the y-axis. The D3.js v5 code uses `scaleTime` and `scaleLinear` for axes, `line` with `curveBasis` for the smoothed path, and `axisBottom` and `axisLeft` for gridlines and ticks. Data is parsed from a CSV file, rendered as an SVG, and styled with maroon strokes and custom fonts. The chart includes a title and axis labels, presenting a clean, minimal aesthetic.

Ddeep221b

82% match

Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, with time on the x-axis and degrees Celsius on the y-axis, sourced from Data Canvas - Sense Your City. The visualization uses D3 v5 to parse the CSV data, apply time and linear scales, and draw a smoothed curve via `line()` with `curveBasis`. Axis labels and tick marks are generated using `axisBottom` and `axisLeft`, while the SVG rendering includes a maroon path with styled gridlines and text elements.

Iindushashi.g@gmail.com

81% match