Skip to main content
SimilarExport ZIP
100%

Line Chart with Multiple Lines

✓ Published0🌍 Public
Iishmam11
Last edited Sep 20, 2020
Created on Sep 20, 2020

A line chart displays one week of temperature readings in Celsius for multiple cities, sourced from the Data Canvas - Sense Your City dataset. The visualization uses d3.line with curveBasis to create smooth paths per city, colored via an ordinal scale from schemeCategory10, and includes axes with gridlines, labels, and a color legend. It relies on d3.csv for data loading, scaleTime and scaleLinear for scales, nest() for grouping by city, and a custom colorLegend module, all rendered as SVG elements with d3.v5.

AI-generated description

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

MIT Licensed

Similar vizzes

Loading thumbnail…

Line Chart with Multiple Lines

A line chart displays a week of temperature readings (in Celsius) for multiple cities, sourced from Data Canvas – Sense Your City. Each city has its own colored path, rendered as smooth curves using `d3.line` with `curveBasis`, and a legend built via a custom `colorLegend` function. Axes use `axisBottom` and `axisLeft` with grid lines, while data is nested by city using `d3.nest` and sorted by final temperature. The visualization is implemented with D3 v5 and SVG, featuring a title and axis labels.

CCurran Kelleher
97% match
Loading thumbnail…

Line Chart with Multiple Lines

A line chart displays one week of temperature data in degrees Celsius for cities worldwide, sourced from Data Canvas - Sense Your City. Multiple colored lines, one per city, are plotted over time using d3.line with curveBasis interpolation to smooth the paths. The visualization uses d3.scaleTime and d3.scaleLinear for axes, d3.nest to group data by city, and d3.scaleOrdinal with schemeCategory10 for colors. A custom color legend is rendered alongside axes with tick marks and labels, all created using SVG rendering in d3 v5.

Ssiim1
97% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays one week of temperature data (in degrees Celsius) for multiple cities worldwide, sourced from the Data Canvas - Sense Your City project. The visualization uses D3 v5 to render smooth, curving lines (via `curveBasis`) for each city, with an ordinal color scale (`schemeCategory10`) and embedded color legend. The chart leverages `scaleTime` for the x-axis, `scaleLinear` for the y-axis, and `axisBottom`/`axisLeft` for labeled axes, with a title and axis labels included. Data is loaded from a provided CSV file using `csv` and parsed into nested groups by city.

Eec13000ibm
97% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays one week of temperature readings in degrees Celsius for multiple cities worldwide, using data from the Data Canvas - Sense Your City project. Each city appears as a distinct colored line, with a color legend on the right and standard axes labeled "Time" and "Temperature." The visualization uses d3.csv for data loading, d3.nest to group readings by city, and d3.line with curveBasis to generate smooth paths. A d3.scaleTime and d3.scaleLinear map the timestamps and temperatures to x and y positions, while an ordinal color scale assigns hues from schemeCategory10.

Nnkohdatavis
97% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays one week of temperature readings in degrees Celsius for multiple cities worldwide, using data from the Data Canvas - Sense Your City project. Each city appears as a distinct colored line, with a color legend on the right and standard axes labeled "Time" and "Temperature." The visualization uses d3.csv for data loading, d3.nest to group readings by city, and d3.line with curveBasis to generate smooth paths. A d3.scaleTime and d3.scaleLinear map the timestamps and temperatures to x and y positions, while an ordinal color scale assigns hues from schemeCategory10.

Nnkohdatavis
97% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays one week of temperature readings in degrees Celsius across multiple cities, with each city represented by a distinct colored line. The chart uses d3.line with curveBasis for smooth curves, d3.scaleTime for the time axis, d3.scaleLinear for temperature, and d3.scaleOrdinal with schemeCategory10 for city colors. Data is loaded via d3.csv from the Data Canvas - Sense Your City dataset, parsed into timestamp and temperature values, then nested by city using d3.nest. A custom colorLegend module renders the legend, while the chart includes axis labels, gridlines, and a title.

AAziz Jaffrey
97% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart visualizes one week of temperature readings in degrees Celsius for multiple cities, with each city represented by a colored line. The data comes from the Data Canvas - Sense Your City project. Using d3.line with curveBasis, the chart smooths the temperature trends over time, while d3.scaleTime and d3.scaleLinear map timestamps and temperatures to the SVG canvas. A color legend built with a custom d3 module and d3.scaleOrdinal helps identify each city, and axis labels clarify the time and temperature scales.

AAleksandr
97% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays one week of temperature data in degrees Celsius for cities worldwide, sourced from Data Canvas - Sense Your City. It uses d3.csv to load the dataset, with d3.scaleTime and d3.scaleLinear for the axes, and d3.nest to group readings by city. Multiple lines are rendered using d3.line with a curveBasis interpolation, while d3.scaleOrdinal assigns categorical colors. A custom colorLegend function generates the city legend, and d3.axisBottom and d3.axisLeft create gridlines.

Sssatabdwi
97% match