Skip to main content
SimilarExport ZIP
100%

Temperature

✓ Published1🌍 Public
HHadi Boukdir
Last edited Jul 16, 2019
Created on Jul 16, 2019
Forked from Cars Scatter Plot

A line chart tracks temperature over time for a week in San Francisco, with circular marks for each data point. The visualization uses D3.js v5 with time and linear scales, and renders grid lines via axis tick marks. Data is loaded from a CSV file from Vizhub’s dataset. SVG output is styled with custom CSS, including axis labels and a title.

AI-generated description

bar chart

MIT Licensed

Similar vizzes

Loading thumbnail…

Temperature in San Francisco

A line chart shows temperature readings over one week in San Francisco, with circular points connected by axes labeled “Time” and “Temperature.” The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` to map timestamps and temperature values, rendering SVG circles and gridlines. Data loads from a CSV file on VizHub, and styling is applied via external CSS.

Jjsong
94% match
Loading thumbnail…

Temperature Line Chart

This line chart visualizes a week of temperature and time data in San Francisco, using an orange curve to highlight temperature fluctuations over time. The visualization is rendered with D3 v5 into an SVG canvas, leveraging d3.scaleTime and d3.scaleLinear for axes, d3.line with curveBasis for the smooth path, and d3.axisLeft/axisBottom for labeled ticks. Temperatures are loaded as CSV from a VizHub dataset, with timestamps parsed as dates and numeric temperature values, while styled axes, title, and gridlines come from custom CSS classes.

HHadi Boukdir
94% match
Loading thumbnail…

Temperature Line Chart

This line chart visualizes temperature readings taken over a week in San Francisco, plotting time on the x-axis against temperature on the y-axis. The chart uses D3 v5 to render an SVG, with an area chart generated using `area` and `curveBasis` to create a smooth, filled contour beneath the line. The scales are defined with `scaleTime` and `scaleLinear`, and axes are added via `axisBottom` and `axisLeft`, with the data loaded from a CSV file using D3's `csv` function.

HHadi Boukdir
94% match
Loading thumbnail…

Temperature

This line chart displays one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City. The visualization uses d3.csv to load the dataset, then renders a smooth curved line with d3.line and curveBasis. Time and temperature scales are created with d3.scaleTime and d3.scaleLinear, while d3.axisBottom and d3.axisLeft generate the axes. The chart includes labeled axes for Time and Temperature, grid lines via tickSize, and a title, all drawn as SVG elements within a 960x500 viewport.

KKelsey Xu
93% match
Loading thumbnail…

Temperature in San Francisco linechart

A line chart visualizes temperature readings in San Francisco over a single week, with time on the x-axis and temperature on the y-axis. The chart displays a smooth curve through the data points using a basis spline, and includes labeled axes, grid lines, and a title. The visualization is built with D3 v6, using `scaleTime`, `scaleLinear`, `line`, and `curveBasis`, and renders as an SVG. Data is loaded from a CSV file hosted on VizHub, parsed with `csv()`, and transformed into JavaScript Date and numeric values.

TTimothy sit
93% match
Loading thumbnail…

Temperature in San Francisco Line Chart

A line chart shows temperature readings across a week in San Francisco, with time on the x-axis and temperature on the y-axis. The chart uses D3 v5 to load CSV data, create time and linear scales, and render an SVG area path with a smooth curve. It also includes grid lines, axis labels, and a title, with data sourced from a CSV hosted on VizHub.

CChenluWang96
93% match
Loading thumbnail…

Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, measured in degrees Celsius, over time. The visualization uses D3 v5 with an SVG rendering approach, employing `scaleTime` and `scaleLinear` for the axes, `axisBottom` and `axisLeft` for grid lines and labels, and a `line` generator with `curveBasis` to smooth the temperature curve. The data is loaded from a CSV file hosted on VizHub, sourced from the Data Canvas - Sense Your City project. The chart includes axis labels, a title, and a maroon smoothed line to show temperature fluctuations.

Mmihir2709
93% match
Loading thumbnail…

Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data in San Francisco, with time on the x-axis and temperature in degrees Celsius on the y-axis. The chart is rendered as an SVG using D3 v5, employing `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` for a smooth curve. The data is loaded from a CSV file hosted on VizHub, which originates from the Data Canvas - Sense Your City initiative. Custom styles define the title, axis labels, and maroon line with a steelblue hover state.

Mmyskotima130
93% match