Skip to main content
SimilarExport ZIP
100%

Fork of Temperature in San Francisco Line Chart

✓ Published0🌍 Public
Vvk
Last edited Aug 30, 2022
Created on Aug 30, 2022

This fork displays a week of temperature data for San Francisco as a smooth line chart, from a Data Canvas dataset. D3 v5’s `scaleTime` and `scaleLinear` map timestamps and temperatures to SVG coordinates, while `axisBottom` and `axisLeft` render labeled grid axes. The `line` generator with `curveBasis` draws the curved path, and the SVG titling and styling come from appended text elements and CSS classes.

AI-generated description

This line chart shows one week of temperature (in degrees Celcius) in San Francisco. The data comes from Data Canvas - Sense Your City.

Made in this video:

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This fork of a D3.js line chart visualizes one week of temperature data in San Francisco, sourced from Data Canvas. It plots temperature values over time on SVG-rendered axes, using `scaleTime` and `scaleLinear` for scaling, with `axisBottom` and `axisLeft` for tick marks. The line is drawn with a `line` generator and a basis curve, styled as a maroon path. The chart includes labeled axes and a title, all rendered via the d3.v5 library.

SSeongwoo Choi
97% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City, with time on the x-axis and degrees Celsius on the y-axis. It renders as an SVG using D3 v5, employing `scaleTime` and `scaleLinear` for axes, `axisBottom` and `axisLeft` for ticks, and a `line` generator with `curveBasis` for the smoothed path. The chart includes labeled axes, a title, and styled tick lines and text via CSS.

BBurg
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart shows temperature readings across one week in San Francisco, with time on the x-axis and temperature on the y-axis. The data is loaded from a CSV file and rendered as a smooth curved line using D3 v5’s `line` generator with `curveBasis`. Axes are created with `axisBottom` and `axisLeft`, while scales use `scaleTime` and `scaleLinear`. The SVG output includes labeled axes, a title, and a maroon stroke for the line path.

Bbbroker
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, sourced from Data Canvas - Sense Your City. The visualization uses D3 v5 to parse the CSV data, apply time and linear scales, and draw a smoothed curve via `line()` with `curveBasis`. Axis labels and tick marks are generated using `axisBottom` and `axisLeft`, while the SVG rendering includes a maroon path with styled gridlines and text elements.

Iindushashi.g@gmail.com
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City. The SVG rendering uses D3 v5 to plot time against temperature, with a smooth curve generated by the `line` and `curveBasis` functions. Styled axes and tick marks are configured via `axisLeft`, `axisBottom`, and CSS classes, while the chart includes labeled axes, a title, and a maroon polyline. The data is loaded as CSV asynchronously, parsed into date and numeric values, and then scaled with `scaleTime` and `scaleLinear` for the x and y dimensions.

Ffrozengem397
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart visualizes one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City, with time on the x-axis and temperature in degrees Celsius on the y-axis. The D3.js v5 code uses `scaleTime` and `scaleLinear` for axes, `line` with `curveBasis` for the smoothed path, and `axisBottom` and `axisLeft` for gridlines and ticks. Data is parsed from a CSV file, rendered as an SVG, and styled with maroon strokes and custom fonts. The chart includes a title and axis labels, presenting a clean, minimal aesthetic.

Ddeep221b
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, sourced from the Data Canvas - Sense Your City dataset. The visualization uses D3 v5 with an SVG rendering approach, employing `scaleTime` and `scaleLinear` for axes, `axisBottom` and `axisLeft` for ticks, and a `line` generator with `curveBasis` to smooth the temperature curve. Circles mark individual data points. The chart includes labeled axes for time and temperature, a title, and a styled maroon path with gridlines, all composed within a fixed-width SVG canvas.

Eetiosa
96% match
Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This fork of a Data Canvas project visualizes one week of temperature data in San Francisco as a smooth line chart. The SVG rendering is built with d3.v5, using `scaleTime` and `scaleLinear` for the axes and a `line` generator with `curveBasis` for the smoothed temperature path. Data is loaded from a CSV file via VizHub, with timestamps converted to `Date` objects and temperatures to numbers. Grid lines, axis labels, and a title are drawn using standard D3 axis and text primitives, all styled with the accompanying CSS.

Pprojectcybersyn2
96% match