Skip to main content
SimilarExport ZIP
100%

Untitled

✓ Published1🌍 Public
RResl411
Last edited Nov 21, 2019
Created on Nov 21, 2019
Forked from Hello VizHub

This interactive line chart displays temperature data through time, with a dropdown to switch between Fahrenheit and Celsius scales. The visualization renders multiple city temperature series as smooth cardinal curves, using D3 v5 with SVG and animated transitions. A mouse-over interaction uses a bisector to find the nearest date, displaying a vertical guide line, value labels, and colored circles for each city at the hovered position. The y-axis updates dynamically with the selected metric via a smooth transition.

AI-generated description

An example showing the capabilities of VizHub.

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

This interactive line chart displays temperature data in either Fahrenheit or Celsius from a CSV file, with a dropdown menu to switch between metrics. The visualization uses D3.js v5 to render SVG paths with cardinal curve smoothing, and includes a hover tooltip that reveals exact dates and values using bisector-based mouse tracking. The chart updates its y-axis domain and line paths dynamically when the metric changes, with CSS transitions providing smooth animations.

RResl411
94% match
Loading thumbnail…

graph1

This visualization shows six line charts tracking temperature metrics for three cities in both Fahrenheit and Celsius across a year, switchable via a dropdown menu. The SVG is rendered with D3 v5, and the lines use an ordinal color scale and cardinal curve interpolation. A hover interaction uses a bisector to locate the nearest date, displaying a vertical guide line, date label, and city-specific values with formatted degrees. The y-axis transitions smoothly when switching units.

JJoseph D. Galloway II
87% match
Loading thumbnail…

Untitled

A multi-line chart displays daily temperature readings for New York, San Francisco, and Austin, with each city’s time series drawn as a smooth, colored path. The visualization uses d3.tsv to load the data, d3.scaleTime and d3.scaleLinear for positioning, and d3.line with curveBasis for the paths. Interactive labels trigger hover and click handlers that highlight or toggle the visibility of each city’s line using d3 selection styling. A d3.zoom behavior is applied to the SVG, though its zoom event handler remains empty.

Ddonaldminer
85% match
Loading thumbnail…

Untitled

A multi-line chart displays temperature readings for New York, San Francisco, and Austin over several days in October 2011, using D3.js v3 with SVG rendering. The visualization uses `d3.time.scale` for the x-axis, `d3.scale.linear` for temperature, and `d3.svg.line` with basis interpolation to draw smooth curves. It colors each city's line via `d3.scale.category10`, adds a legend, and includes a mouse-over effect with a vertical guide line. Data is parsed from tab-separated text using `d3.tsv.parse`.

LL1EO
85% match
Loading thumbnail…

Untitled

This interactive multi-line chart displays daily temperature trends for New York, San Francisco, and Austin, with each city represented by a colored curve on a shared time axis. Hovering over a line highlights it in its original color while graying out the others, and clicking a line toggles its visibility. Built with D3 v6, the visualization uses SVG rendering with animated transitions, d3.axisBottom and d3.axisLeft for axes, and d3.scaleTime, d3.scaleLinear, and d3.scaleOrdinal for scaling. Data is loaded via d3.tsv from a remote source.

Hhollyjpotter
84% match
Loading thumbnail…

Untitled

This interactive line chart compares daily high temperatures in New York, San Francisco, and Austin, with each city rendered as a steel-blue path. The chart uses D3.js v3 with `d3.time.scale` for the date axis and `d3.scale.linear` for the temperature axis, while `d3.interval` and `d3.svg.line` draw the smoothed curves. The data is embedded as a tab-separated string, parsed via `d3.tsv.parse`, and colors are assigned using `d3.scale.category10()`. A legend and mouse-over effects are included to highlight the selected city's values.

Ddanala0941
84% match
Loading thumbnail…

Untitled

A multi-line chart displays monthly temperature averages for New York, San Francisco, and Austin, with each city’s time series drawn as a smooth basis curve. The SVG rendering uses D3 v7 scales and axes to map dates and temperatures, while the `d3.zoom` API enables pan and zoom interactions on the chart. City labels follow the final data point, and the code includes placeholder hooks for hover and click handlers. Data is loaded from a TSV file via `d3.tsv`, with colors assigned through `d3.scaleOrdinal`.

SSimon Hackbert
83% match
Loading thumbnail…

Untitled

This visualization displays daily temperature readings for New York, San Francisco, and Austin over a three-week period in October 2011. The code uses D3 v3 with SVG rendering to create smoothed line charts, with each city’s data series distinguished by color and labeled with a legend and endpoint text. The chart includes a time-scaled x-axis and linear y-axis labeled in Fahrenheit, with values parsed from a TSV data string embedded in the page. A mouse-over effects group is initialized but remains inactive in the rendered output.

Pperformautodev
83% match