logscale

100%

✓ Published0🌍 Public

Last edited May 13, 2021

Created on May 13, 2021

Forked from Working with time temperature

This scatter plot displays San Francisco temperature readings over a week, using a logarithmic y-axis (d3.scaleLog) to compress the range of temperature values. React components render the SVG, with d3.scaleTime mapping timestamps to the x-axis and d3.extent computing the domain. The visualization includes custom axes, radial gradient eyes, and a face-like background circle, while data loads from a CSV via d3.csv.

AI-generated description

A scatter plot of [Iris] https://gist.githubusercontent.com/curran/a08a1080b88344b0c8a7/raw/0e7a9b0a5d22642a06d3d5b9bcbad9890c8ee534/iris.csv

MIT Licensed

Similar vizzes

Loading thumbnail…

Time Scatterplot

A time scatterplot charts temperature readings against timestamps from a week of San Francisco weather data, with a smooth curved line connecting the points. The visualization uses React components to render SVG elements, while D3's `scaleTime`, `scaleLinear`, `extent`, and `line` with `curveNatural` handle scaling and path generation. Axis components map tick values to grid lines and labels, and the temperature values are parsed as numbers and timestamps as Date objects.

JJenna Hamza

83% match

Loading thumbnail…

Temperature in SF Scatter Plot with D3.js!

This scatter plot visualizes a week of temperature data in San Francisco, displaying temperature in degrees Celsius over time. The code imports functions from D3.js, including `select`, `csv`, `extent`, `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom`, to render an SVG chart. Data is loaded from a CSV URL and parsed, with the plot featuring labeled axes, grid lines, and steelblue circles. The chart includes axis labels and a title, with styling applied via external CSS.

Fforcox43

82% match

Loading thumbnail…

Working with Time

This scatter plot shows San Francisco temperature readings over a week, with time on the x-axis and temperature on the y-axis. Each circle represents a single hourly measurement, with a native SVG `<title>` element providing a tooltip on hover. The visualization uses React to render SVG elements, with D3's `scaleTime`, `scaleLinear`, and `extent` functions handling the scales and domains. Data is loaded asynchronously from a CSV file via the `d3.csv` method, and custom React components for the axes and marks keep the code modular.

Vvangenned

82% match

Loading thumbnail…

Scatter Plot with Time Series

A scatter plot displays temperature readings against timestamps from a San Francisco weekly weather dataset, using circular marks positioned by time and linear temperature scales. Built with React and D3 v6, the visualization renders as SVG with reusable axis components and tooltips showing formatted day labels. Data loads via CSV from a remote gist, with `scaleTime` and `scaleLinear` handling the mapping, while `d3.timeFormat` formats tick labels.

AAndres de la Garza

82% match

Loading thumbnail…

Working with Time

This scatterplot displays daily temperature readings across one week in San Francisco, using a time-scaled x-axis for timestamps and a linear y-axis for temperature degrees. Built with React and SVG, the visualization implements custom reusable axis and mark components that render circles with tooltips, powered by d3.scaleTime, d3.scaleLinear, d3.extent, and d3.csv for data loading.

SSam Hege

82% match

Loading thumbnail…

Fork of Scatter Plot

This interactive scatter plot visualizes temperature readings over time using React and D3 v7. The visualization employs scaleTime and scaleLinear to map timestamps and temperature values to SVG coordinates, while custom AxisBottom and AxisLeft components render the time-formatted x-axis and numeric y-axis. The data is loaded asynchronously from a CSV file containing weekly San Francisco temperature measurements using D3's csv utility. Each data point is rendered as a circle mark with a tooltip displaying the day of the week.

Nnkarinti

82% match

Loading thumbnail…

Line chart

This line chart displays temperature readings over a week, sampled from San Francisco weather data loaded via d3.csv. The React components render an SVG with time-scaled x-axis and linear y-axis, using d3.scaleTime, d3.scaleLinear, and d3.extent for domains. Data points appear as circles, connected by a smooth path generated with d3.line and curveNatural. Axes are custom React components that map tick values from d3 scales, with the y-axis labels formatted using d3.timeFormat.

TTakuya Kitazawa

82% match

Loading thumbnail…

Time based scatter plot

This visualization is a time-based scatter plot that displays temperature readings from San Francisco over a week. The x-axis represents time, formatted to show day abbreviations, while the y-axis shows temperature values. The plot updates dynamically, rendering each data point as a circle. The code uses React for the user interface and D3 v6 APIs such as `scaleTime`, `scaleLinear`, and `extent` to map data to coordinates. The data is loaded from a CSV file via D3's `csv` function, and the chart is rendered as an SVG using custom Components like `AxisBottom`, `AxisLeft`, and `Marks`.

AAnthony Ynami

82% match