Skip to main content
SimilarExport ZIP
100%

Fork of Temperature in San Francisco Line Chart

✓ Published1🌍 Public
KKaleb LaBarrie
Last edited Sep 19, 2021
Created on Sep 19, 2021

This line chart visualizes one week of temperatures in San Francisco, with a smooth curve showing how temperatures fluctuate over time. The visualization uses D3.js v7 to load CSV data and render an SVG, employing `scaleTime` and `scaleLinear` for the axes, `line` with `curveBasis` for the curved path, and `axisBottom`/`axisLeft` for labeled ticks. The chart displays the title and axis labels (Time and Temperature) within a 960x500 SVG canvas, showing the daily temperature trend in degrees Celsius.

AI-generated description

This line chart shows one week of temperature (in degrees Celcius) in San Francisco.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, plotting temperature in Celsius over time. The chart uses a smooth basis curve to connect data points, with a title, axis labels, and a maroon line against a light grid. Built with D3 v7, it uses `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` to render the SVG. The data is loaded from a CSV file containing timestamps and temperatures, with circles styled in the CSS but not rendered in the JavaScript.

JJaga-droid
97% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays a week of temperature data in San Francisco, using a smooth curved line to connect daily measurements. The visualization, titled “A Week in San Francisco,” plots temperature in degrees Celsius over time. The code uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` to render the SVG. Data is loaded from a CSV file provided by Data Canvas - Sense Your City, with a styled maroon line, grid lines, and labeled axes.

CCheng Tang
97% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, using smooth curves to connect hourly readings. The visualization uses d3.csv to load data and d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.line with curveBasis to render the SVG chart. Axis labels and a title are added via SVG text elements, while d3.extent sets the domain for both scales. The dataset originates from Data Canvas - Sense Your City, sourced from the vizhub.com repository.

GGriffin Wimminger
97% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data (in degrees Celsius) for San Francisco, sourced from Data Canvas - Sense Your City. It shows how temperature fluctuates over time. The visualization is built with D3 v5, using `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and a `line` generator with `curveBasis` to create the smooth path. The SVG chart includes axis labels, a title, and a maroon line on a grid with white space, rendered from a CSV dataset fetched via `csv()`.

Ddatacore-inikolov
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes a week of temperature data in San Francisco, with time on the x-axis and degrees Celsius on the y-axis. The visualization is built with D3.js v5, using `scaleTime` and `scaleLinear` for axes, `axisBottom` and `axisLeft` for tick marks, and `line` with `curveBasis` to draw the smoothed temperature curve. The data originates from the Data Canvas - Sense Your City project and is loaded via a CSV file from vizhub. The SVG rendering includes custom styling for gridlines, axis labels, and a title.

AAustin0524
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, with time on the x-axis and degrees Celsius on the y-axis. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with a `curveBasis` smoother to draw the maroon temperature curve. Data is loaded via `csv` from a remote dataset, and the SVG rendering includes styled axes, tick marks, and a title. The code demonstrates a typical margin-based layout with axis labels and gridlines, sourced from Data Canvas - Sense Your City.

NNoobSaiyan
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, with time on the x-axis and degrees Celsius on the y-axis. The smooth line is generated using d3.line with curveBasis, while d3.scaleTime and d3.scaleLinear map the data domains. Axes are rendered with d3.axisBottom and d3.axisLeft, featuring gridlines and rotated labels. The code loads CSV data from a VizHub dataset, parses timestamps and numeric temperatures, and uses d3.select and SVG elements to build the visualization, styled with custom CSS classes.

BBurg
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, with time on the x-axis and degrees Celsius on the y-axis. The smooth line is generated using d3.line with curveBasis, while d3.scaleTime and d3.scaleLinear map the data domains. Axes are rendered with d3.axisBottom and d3.axisLeft, featuring gridlines and rotated labels. The code loads CSV data from a VizHub dataset, parses timestamps and numeric temperatures, and uses d3.select and SVG elements to build the visualization, styled with custom CSS classes.

BBurg
96% match