Scatter plot, temperature over time.

100%

Scatter plot, temperature over time.

✓ Published1🌍 Public

Last edited Mar 27, 2021

Created on Mar 27, 2021

A scatter plot displays temperature readings over the course of a week, with time on the x-axis and temperature on the y-axis. The visualization uses React with D3 v5’s `scaleTime` and `scaleLinear` to map data points, rendered as SVG circles. Each circle includes a tooltip showing the day of the week. Data is loaded asynchronously from a CSV file via the `csv` function.

AI-generated description

A scatter plot of temperature over time.

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot with time

A scatter plot displays temperature readings over time, using a smooth curve to connect the data points. The x-axis uses a time scale with week-day labels, while the y-axis uses a linear scale for temperature values. Built with React and D3 v5, the visualization reads CSV data from an external URL, renders axes and marks as SVG elements, and uses the `line` and `curveNatural` functions to create the connected path.

Aadewole-top

93% match

Loading thumbnail…

Scatter Plot with Time

This scatter plot visualizes temperature readings over time, with each circle representing a measurement plotted along a time-based x-axis and a linear temperature y-axis. Built with React and D3 v5, the visualization uses `scaleTime` and `scaleLinear` to map data from a CSV file into SVG circles. The chart includes labeled axes with formatted weekday tick marks on the x-axis, and hovering over a circle reveals the exact time through SVG `<title>` tooltips.

MMarco Malvicini

91% match

Loading thumbnail…

Time scatter plot

This time scatter plot visualizes temperature readings over time as red circles on an SVG canvas. The visualization uses D3's `scaleTime` and `scaleLinear` for axes mapping, with `timeFormat` to display weekday labels on the bottom axis. React renders each data point as a circle, with tooltips showing the formatted timestamp. The chart loads data from a CSV file via D3's `csv` utility, and custom React components handle axis and mark rendering.

Yyastika

89% match

Loading thumbnail…

Working with Time

This scatterplot displays temperature readings over the course of a week, with time on the x-axis and temperature on the y-axis. Each orange circle represents a data point, and hovering reveals its exact timestamp and temperature. The visualization is built with React and D3 v5, using `scaleTime` and `scaleLinear` to map the data. SVG elements render the axes, tick marks, and labels, while the data is loaded from a CSV file and parsed with `csvParse`.

EEhtisham UL Hassan

89% match

Loading thumbnail…

Working with Time

A scatterplot displays temperature readings over the course of a week, with time on the x-axis and temperature on the y-axis. The visualization is built with React and D3 v6, using `scaleTime` and `scaleLinear` to map data domains to pixel coordinates. The `Marks` component renders circles for each data point, while the `AxisBottom` and `AxisLeft` components draw the axes. Data is loaded from a CSV file via D3's `csv` method, with timestamps parsed as `Date` objects and temperatures converted to numbers.

CCodeDuckie99

89% match

Loading thumbnail…

Temperature scatterplot chart

A temperature scatterplot shows hourly temperature readings over one week, with time on the x-axis and degrees on the y-axis. Each data point is an SVG circle colored teal, with a native `<title>` tooltip displaying the exact temperature value. The chart uses React components for the axes and marks, while D3 v6 APIs (`scaleTime`, `scaleLinear`, `extent`, `csv`) handle data loading, scaling, and tick generation. The dataset comes from the Sense Your City weather CSV, and labels are formatted with `timeFormat`.

Ssurikmeetr

88% match

Loading thumbnail…

Working with Time

This scatter plot displays temperature readings over the course of a week, with time on the x-axis and temperature on the y-axis. Built with React and D3 v5, it uses `scaleTime` and `scaleLinear` to map the data, with `extent` and `max` computing the domains. The visualization renders as an SVG, with custom axis components and circular marks that include tooltips via SVG `<title>` elements. Data comes from the Data Canvas Sense Your City dataset, loaded as CSV through `d3.csv`.

Jjerate11

88% match

Loading thumbnail…

time

A time-series scatterplot displays temperature readings over the course of a week, with each point representing a timed measurement. The visualization uses a time-scaled x-axis and linear y-axis with labeled ticks to orient the viewer. Data comes from the San Francisco weekly temperature CSV, loaded asynchronously via `d3.csv` in a custom React hook. React components render SVG circles and axes using `d3.scaleTime` and `d3.scaleLinear`, with axis tick generation handled by reusable `AxisBottom` and `AxisLeft` components.

Jjth500

88% match