Temperature in US Cities over Time

100%

Temperature in US Cities over Time

✓ Published0🌍 Public

Last edited Apr 7, 2022

Created on Apr 7, 2022

This visualization displays temperature measurements for New York, San Francisco, and Austin over time, using multiple colored lines on a shared time axis. The chart lets users click on city labels to show or hide corresponding lines, with hover interactions resetting stroke colors. Built with D3 v7, it loads a TSV dataset, parses dates with `d3.timeParse`, and renders SVG paths via `d3.line` with curve interpolation. The y-axis is labeled in degrees Fahrenheit, and lines are colored using `d3.scaleOrdinal` with `d3.schemeCategory10`.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

This visualization demonstrates temperature trends over time for three cities—New York, San Francisco, and Austin—using a multi-series line chart. The chart displays daily temperature readings across roughly three weeks, with each city represented by a distinct colored line and accompanied by a legend and labeled endpoints. The visualization uses D3 version 3.5.3, specifically leveraging `d3.tsv.parse` to read tab-separated data, `d3.time.scale` for the x-axis, and `d3.svg.line` for drawing the paths. Temperature data is parsed as dates and mapped to a linear y-axis, with city names colored via `d3.scale.category10`.

CCrossZeigler

89% match

Loading thumbnail…

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over one year, using color to distinguish each city's trend. The visualization encodes dates on the x-axis via `d3.time.scale` and temperatures on the y-axis via `d3.scale.linear`, with `d3.svg.axis` rendering the axes. Data is loaded from a TSV file using `d3.tsv`, and each city’s line is drawn with `d3.svg.line`, colored by `d3.scale.category10`. The chart uses conventional margins and an SVG rendering approach, with city labels placed at the final data point.

CCdcole

87% match

Loading thumbnail…

Line Chart Visualization

A multi-line chart displays daily temperature readings for New York, San Francisco, and Austin from October 2011 through April 2012, with each city represented by a colored line. Built with D3 v7, the visualization supports interactive filtering: hovering over a city name highlights its line while dimming others, and clicking toggles a line's visibility. Users can also brush or zoom along the time axis. The SVG-based rendering uses d3.line with curveBasis, d3.scaleTime, d3.scaleLinear, and d3.zoom, with data loaded from a TSV file.

GGoogs

87% match

Loading thumbnail…

Multi-Series Line Chart V7

This interactive multi-series line chart visualizes daily average temperatures for New York, San Francisco, and Austin from October 2011 through April 2012. It displays three color-coded temperature trends over time, with a legend for city selection. The visualization supports zooming and panning along the time axis, and users can click legend items to toggle the visibility of individual city lines. Hovering over a legend dims non-selected series. The code uses D3 v7 with `d3.scaleTime`, `d3.line` with `d3.curveBasis`, and an SVG rendering. It loads data from a TSV file and includes animation via D3's transition and zoom APIs.

Pprateekvasi

87% match

Loading thumbnail…

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over a year, with each city represented by a distinct colored line. The visualization uses D3 v4’s SVG rendering, parsing a TSV file with `d3.tsv` and `d3.timeParse`. It encodes time on the x-axis via `d3.scaleTime`, temperature on the y-axis with `d3.scaleLinear`, and city categories using `d3.scaleOrdinal` with `d3.schemeCategory10`. The chart includes interactive zooming through `d3.zoom` and clickable city labels that toggle line visibility.

CCatherine-Yu

87% match

Loading thumbnail…

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over a year, sourced from a TSV file. Each city’s temperature trend is drawn as a colored line, with points highlighted by circles and extreme values (below 20° or above 89°) labeled directly on the plot. The visualization uses D3 v4 APIs such as `d3.tsv` for data parsing, `d3.timeParse` for date handling, `d3.scaleTime`, `d3.scaleLinear`, `d3.scaleOrdinal` and `d3.schemeCategory10` for encoding, and `d3.line` with SVG paths to render the series.

CCatherine-Yu

87% match

Loading thumbnail…

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over one year, loaded from a TSV file via d3.tsv. The visualization uses d3.time.scale for the x-axis, d3.scale.linear for the y-axis, d3.scale.category10 for color encoding, and d3.svg.line with basis interpolation to draw each city’s temperature trend. Axes are rendered with d3.svg.axis, while d3.extent, d3.min, and d3.max compute the domains. City labels appear at the end of each line, and the SVG output uses conventional margins.

CCdcole

87% match

Loading thumbnail…

step3

This visualization displays daily average temperatures for New York, San Francisco, and Austin from October 2011 through April 2012. Three separate lines, each representing a city, are drawn over time on a common set of axes, allowing for direct comparison of temperature trends and seasonal variations across the locations. The graphic is rendered as an SVG using the D3.js v4 library, employing `d3.line` and `d3.curveBasis` to create smooth paths. The code loads tab-separated data via `d3.tsv`, parses the date column with `d3.timeParse`, and maps the categorical city names to colors using `d3.scaleOrdinal` with the `d3.schemeCategory10` palette.

深深度碎片

87% match