Skip to main content
SimilarExport ZIP
100%

Line Chart with Multiple Lines

✓ Published1🌍 Public
Aajaykumar2014
Last edited Jul 13, 2020
Created on Jul 13, 2020

This line chart displays a week of temperature readings in degrees Celsius across multiple global cities, with each city represented by a colored line. The visualization uses d3.scaleTime and d3.scaleLinear to map time and temperature axes, while d3.nest groups the data by city for individual line paths generated with d3.line and curveBasis. A custom colorLegend component renders the categorical color scale using d3.scaleOrdinal. The data comes from Data Canvas - Sense Your City, and the SVG rendering includes gridlines, axis labels, and a title.

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

This line chart displays one week of temperature readings in degrees Celsius for multiple cities worldwide, with each city represented by a colored line and a categorical legend. The visualization uses d3.scaleTime and d3.scaleLinear for axes, d3.line with curveBasis for smooth paths, and d3.nest to group data by city. Data comes from Data Canvas - Sense Your City, rendered as SVG with a color legend built from d3.scaleOrdinal and schemeCategory10. The chart includes gridlines from axis ticks and a title.

KKarkG
98% match
Loading thumbnail…

Line Chart with Multiple Lines

This visualization shows one week of temperature data in degrees Celsius for cities around the world, with each city represented by a colored line. The chart uses d3.scaleTime for the time axis, d3.scaleLinear for temperature, and d3.scaleOrdinal with schemeCategory10 for city colors. Lines are generated with d3.line and curveBasis, while d3.nest groups measurements by city. A color legend is rendered using a custom component, and the data comes from the Data Canvas - Sense Your City project.

SSagar Malviya
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 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 world cities, with each city represented by a distinct colored line. The visualization uses D3 v5’s scaleTime, scaleLinear, scaleOrdinal, and nest to group data by city, while a line generator with curveBasis smooths each temperature trend. A color legend, rendered via a custom colorLegend module, identifies the cities. The data comes from the Data Canvas - Sense Your City dataset, loaded as CSV, and the chart is drawn as SVG with gridlines and axis labels.

JJosé
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. Multiple colored lines represent different cities, sorted by their final temperature values, with a color legend identifying each series. The visualization uses d3.scaleTime, d3.scaleLinear, and d3.scaleOrdinal to map time, temperature, and city categories, while d3.line with curveBasis generates smooth paths. Axes are rendered via d3.axisBottom and d3.axisLeft, with d3.nest grouping the data by city.

OOday4
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