Skip to main content
SimilarExport ZIP
100%

Fork of Line Chart with Multiple Lines

✓ Published0🌍 Public
Bbosonfor
Last edited Feb 8, 2023
Created on Feb 8, 2023

This line chart visualizes one week of temperature data for multiple cities around the world, sourced from Data Canvas - Sense Your City. Each city is represented by a smoothly curved line, with a color legend on the right helping to identify them. Built with D3 v5, the visualization uses `d3.line` with `curveBasis` to generate the paths, `d3.scaleTime` and `d3.scaleLinear` for the axes, and a custom `colorLegend` module to render the SVG legend.

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…

Fork of Line Chart with Multiple Lines

This line chart visualizes one week of temperature data for multiple cities around the world, sourced from Data Canvas - Sense Your City. Each city is represented by a smoothly curved line, with a color legend on the right helping to identify them. Built with D3 v5, the visualization uses `d3.line` with `curveBasis` to generate the paths, `d3.scaleTime` and `d3.scaleLinear` for the axes, and a custom `colorLegend` module to render the SVG legend.

Bbosonfor
100% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This line chart visualizes a week of temperature data from cities worldwide, sourced from Data Canvas - Sense Your City. The chart uses D3 v5 to render multiple smoothed lines, one per city, with a color-coded legend. It employs `scaleTime` and `scaleLinear` for axes, `nest` to group data by city, and `curveBasis` for line smoothing. The SVG rendering includes a title, axis labels, and a custom color legend, with city lines sorted by their final temperature values.

JJspring42
97% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This chart displays a week of temperature data from cities worldwide, sourced from Data Canvas - Sense Your City, with each city represented by a differently colored line. The visualization uses d3.scaleTime and d3.scaleLinear for axes, d3.nest to group data by city, and d3.line with curveBasis for smooth line generation. A custom colorLegend component renders the scale, while axis labels and a title complement the SVG rendering.

GGerasimos Katsagannis
97% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This line chart shows one week of temperature data for cities around the world, sourced from Data Canvas - Sense Your City. Each city is represented by a smooth curved line, colored via an ordinal scale, with a legend positioned on the right. Built with D3 v5 in SVG, it uses `scaleTime`, `scaleLinear`, `line` with `curveBasis`, `nest` to group data by city, and `axisBottom`/`axisLeft` for axes. The chart sorts cities by their final temperature value, with axis gridlines and a title.

JJosh2903
97% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This visualization displays one week of temperature data from cities around the world, sourced from Data Canvas - Sense Your City. It uses d3.scaleTime, d3.scaleLinear, and d3.scaleOrdinal to map time, temperature, and city color, with d3.line and curveBasis generating smooth paths. The chart renders in SVG and includes a custom colorLegend function for city labels. Data is loaded via d3.csv, and axes are created with d3.axisBottom and d3.axisLeft.

Ppurplemaestro
96% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This visualization displays one week of temperature data from cities around the world, sourced from Data Canvas - Sense Your City. It uses d3.scaleTime, d3.scaleLinear, and d3.scaleOrdinal to map time, temperature, and city color, with d3.line and curveBasis generating smooth paths. The chart renders in SVG and includes a custom colorLegend function for city labels. Data is loaded via d3.csv, and axes are created with d3.axisBottom and d3.axisLeft.

Ppurplemaestro
96% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This visualization displays a week of temperature measurements from cities worldwide, sourced from the Data Canvas - Sense Your City dataset. It plots multiple lines, one per city, using a basis curve to smooth the temperature trends over time. The chart is built with D3 v5, using `scaleTime` and `scaleLinear` for the axes, `line()` with `curveBasis` for the paths, and `nest()` to group data by city. A color legend is rendered via a custom `colorLegend` component, while axis labels and grid lines are styled with CSS.

Mmaavwin
96% match
Loading thumbnail…

Fork of Line Chart with Multiple Lines

This line chart displays one week of temperature data for cities worldwide, sourced from Data Canvas - Sense Your City. Each city appears as a distinct colored line, with a color legend on the right and a title above the chart. The visualization uses d3.csv to load data, d3.nest to group by city, d3.scaleTime and d3.scaleLinear for axes, and d3.line with curveBasis for smooth paths. It includes axis labels, grid lines, and rendered as SVG with mix-blend-mode for overlapping strokes.

GGriffin Wimminger
96% match