Skip to main content
SimilarExport ZIP
100%

SFO Peak Wind History 2015-2020

✓ Published3🌍 Public
AAndre J Denais
Last edited Nov 3, 2020
Created on Sep 17, 2020

This chart plots daily peak wind speed at San Francisco International Airport from 2015 to 2020 as a scatterplot, with each circle representing a day’s measurement. The x-axis shows time while the y-axis displays wind speed, and hovering reveals the exact value via SVG `<title>` tooltips. Built with React and D3 v6, it uses `scaleTime`, `scaleLinear`, and reusable axis components to render the visualization in SVG. Data comes from NOAA daily climate records.

AI-generated description

This data was requested and collected from the NOAA.

MIT Licensed

Similar vizzes

Loading thumbnail…

SFO Peak Wind History 2015-2020

This scatterplot displays daily peak wind speed at San Francisco International Airport from 2015 to 2020, with each semi-transparent circle representing a day’s measurement. Larger circles and reduced opacity reveal the underlying distribution and density of wind speeds across time, sourced from NOAA climate data. The visualization uses React with D3 v6, employing `scaleTime` and `scaleLinear` for axes, custom `AxisBottom` and `AxisLeft` components for ticks, and SVG circles with tooltips rendered via the `Marks` component.

CCurran Kelleher
97% match
Loading thumbnail…

SFO Peak Wind Speed 2015-2020 with Vega-Lite API

This visualization displays daily peak wind speeds at San Francisco International Airport from 2015 to 2020 as a scatterplot, with each semi-transparent circle representing a day’s measurement. The data is loaded from a NOAA CSV via d3.csv, while the chart itself is built declaratively using the Vega-Lite API, registering Vega and Vega-Lite for rendering. Custom axis and label styling in config.js improves readability, and the plot is rendered as a full-window SVG with tooltips provided by vega-tooltip.

AAndre J Denais
89% match
Loading thumbnail…

SFO 2015-2020 DailyClimateData with Menus & Legend

This interactive scatterplot visualizes daily climate measurements at San Francisco International Airport from 2015 to 2020. A dropdown menu lets users switch which weather attribute—such as wind speed, humidity, or temperature deviation—is plotted on the y-axis against time. A color legend identifies data points by station, with hover states that fade non-matching points for comparison. Built with React and D3 v6, the SVG visualization uses `scaleTime` and `scaleLinear` for axes, `scaleOrdinal` for station colors, and fetches its CSV data from a remote gist via a custom `useData` hook.

AAndre J Denais
82% match
Loading thumbnail…

SFO Daily Departure From Normal Average Temperature 2015-2020

The chart displays daily temperature departure from the normal average at San Francisco Airport (SFO) from 2015 to 2020, with each point representing one day’s deviation. The visualization uses a React and D3 v6 setup, rendering an SVG scatterplot with d3.scaleTime for the x-axis and d3.scaleLinear for the y-axis. Data is loaded via d3.csv from NOAA’s public dataset, and each circle includes a native SVG `<title>` element for basic tooltip functionality. The axes are constructed using custom React components that map D3 scales to SVG elements.

AAndre J Denais
80% match
Loading thumbnail…

SFO NOAA Summary of the Month 1955-2020

This scatterplot displays the average monthly temperature at San Francisco Airport from 1955 to 2020, with each point representing a single month's reading. The chart uses a time-scaled x-axis for dates and a linear y-axis for temperatures, with circles colored in teal. Built with React and D3 v6, it renders SVG elements, including axes and circle marks, while loading CSV data from a NOAA gist. The code employs D3's `scaleTime`, `scaleLinear`, `extent`, and `csv` functions to process and map the data.

AAndre J Denais
79% match
Loading thumbnail…

SFO NOAA Summary of the Month 1955-2020 with Menus

This interactive scatterplot visualizes monthly NOAA climate summaries for San Francisco from 1955 to 2020. A dropdown menu allows users to switch the y-axis between five meteorological attributes, including average wind speed and temperature extremes. The React-based application uses d3.scaleTime and d3.scaleLinear to map the CSV data, rendering each month as a semi-transparent SVG circle. Datasets are loaded asynchronously via d3.csv, with axes and ticks generated by custom React components.

AAndre J Denais
78% match
Loading thumbnail…

HistogramPractice Corpus Christi & SFO 2015-2020 DailyClimateData with Menus & Legend

This interactive scatterplot displays daily climate measurements from Corpus Christi and San Francisco International Airport stations between 2015 and 2020, sourced from NOAA. A dropdown menu lets users switch between five wind-related y-axis attributes, while each point represents a daily observation colored by station. A brushable time-series histogram at the bottom filters the main scatterplot by date range, and hovering over the color legend highlights points from a selected station with reduced opacity. The visualization uses React with D3 v6 scales, axes, brushing, and ordinal color mapping rendered as SVG circles.

AAndre J Denais
74% match
Loading thumbnail…

Line Chart

This line chart visualizes air traffic passenger statistics for San Francisco Airport from 2005 to 2019, comparing annual passenger numbers for multiple airlines. The chart displays each airline as a separate colored line, with year on the x-axis and passenger counts on the y-axis. It uses React and D3 v4 to render an SVG-based chart with animated transitions between states. The data is embedded directly in the page, and the visualization uses D3’s scale functions and axis components to map the temporal and numerical dimensions.

AApollox01
74% match