Skip to main content
SimilarExport ZIP
100%

line chart

✓ Published0🌍 Public
PP Manisha
Last edited Oct 19, 2025
Created on Oct 19, 2025

This line chart visualizes Seattle weather trends in 2016, showing maximum, mean, and minimum temperatures over the first 200 days using three colored lines. The chart combines a multi-series line graph with overlaid bars representing the mean temperature. Built with D3 v7, the code loads CSV data and uses `d3.line()`, `d3.scaleLinear()`, and `d3.axisBottom()` to render the SVG visualization, including axes, labels, and a legend for temperature series.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Line Chart

This line chart displays temperature measurements over time, using a smooth basis curve to connect data points. The visualization is built with D3 version 6 and rendered as an SVG, with the temperature data sourced from a CSV file of San Francisco weather records. The chart employs `scaleTime` and `scaleLinear` for the axes, along with `axisBottom`, `axisLeft`, and `line` to generate the plot.

NNoobSaiyan
79% match
Loading thumbnail…

My first Line Chart temperature

This line chart visualizes temperature trends across multiple cities over a week, with each city represented as a colored line and a legend identifying the color mapping. The visualization uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `scaleOrdinal`, `line` with `curveBasis`, and `nest` to group data by city, while `axisBottom` and `axisLeft` render labeled axes. Data is loaded from a CSV file using `d3.csv`. The chart is rendered as SVG with an animated color legend that transitions its appearance over one second, and the code includes a working example using temperature data from Data Canvas.

HHessamLa
79% match
Loading thumbnail…

Line chart

This line chart visualizes daily mean temperature changes over time, with the x-axis representing days and the y-axis showing mean temperature in degrees. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` APIs to render an SVG path with red strokes. Data is loaded from a CSV file via `d3.csv`, and dates are parsed with `d3.timeParse`. Grid lines are drawn using tick sizes, and axis labels are added manually within the SVG.

KKishen Patel
79% match
Loading thumbnail…

Line Chart temperature

A line chart displays temperature readings in degrees Celsius across a week for multiple cities, with each city’s data drawn as a colored, smoothed path. The visualization renders in SVG with animation, using D3 v5’s `scaleTime`, `scaleLinear`, `line`, `curveBasis`, and `nest` to group data by city. A `colorLegend` component, built with `scaleOrdinal` and `schemeCategory10`, identifies each series. The data comes from the Data Canvas “Sense Your City” dataset, fetched via `d3.csv`. Axis ticks include gridlines, and the chart includes a rotating y-axis label and a title.

Ggilbster
79% match
Loading thumbnail…

Temperature Line Chart

This line chart visualizes temperature readings over time, with a smooth curved line and circular markers at each data point. The visualization uses D3’s `scaleTime` and `scaleLinear` for axes, `line()` with `curveBasis` for the path, and `axisBottom`/`axisLeft` for ticks. Data from a CSV of San Francisco temperatures is loaded via `csv` and parsed into dates and numbers. The SVG rendering includes gridlines, axis labels, and a title, with the line styled in steelblue.

DdeafMother
79% match
Loading thumbnail…

line

This line chart visualizes temperature variations in San Francisco over a week. The SVG renders a smooth curve using d3.line with curveBasis, plotting timestamps against temperature values. Axes are created with d3.axisBottom and d3.axisLeft, including gridlines and rotated axis labels. The data is loaded from a CSV file, parsed for temperatures and dates, then scales are set using d3.scaleTime and d3.scaleLinear.

HHimanshu Chelani
78% match
Loading thumbnail…

Line Chart with Multiple Lines

A line chart displays a week of temperature readings in Celsius for cities worldwide, with each city’s data as a distinct colored line. The visualization prioritizes readability by ordering lines by their final temperature value and using semi-transparent strokes. It uses D3 v5’s `scaleTime`, `scaleLinear`, and `scaleOrdinal` for scales, `nest()` to group data by city, and a custom color legend module. Data comes from the Data Canvas - Sense Your City dataset, rendered as an SVG with axis labels and a title.

BBiki Deka
78% match
Loading thumbnail…

line chart.

This line chart visualizes temperature readings over time in San Francisco, showing how values fluctuate across the dataset’s timeline. The chart uses an SVG rendering approach with D3.js v5, employing `scaleTime` and `scaleLinear` for the axes, and `line` with `curveBasis` to create a smoothed path. Data is loaded via `csv` from a remote file, with timestamps parsed as dates and temperatures converted to numbers. The visualization includes labeled axes with tick marks, gridlines, and a title, while the line itself is styled in maroon for clarity.

YYanxxx447
78% match