p5 Climate Change Dot Plot

100%

p5 Climate Change Dot Plot

✓ Published0🌍 Public

Last edited Feb 8, 2022

Created on Feb 8, 2022

This dot plot visualizes the relationship between average temperature and average temperature uncertainty across global country-level climate data from September 2013 onward. Each blue dot represents a country-month observation, with temperature on the x-axis and uncertainty on the y-axis, using a dataset loaded from a GitHub-hosted CSV file. The p5.js sketch maps raw data values to screen coordinates, draws axes with labeled ticks, and renders approximately 2,500 points per frame using the `point()` API. The visualization reveals how temperature uncertainty varies across different temperature ranges.

AI-generated description

USF 360 Data Visualization - Assignment #2, Part 2

MIT Licensed

Similar vizzes

Loading thumbnail…

p5 Climate Change Bar Chart

This visualization is a horizontal bar chart that presents a histogram of global land temperature data. It shows the distribution of average temperature readings across all countries, with each horizontal bar representing a range of temperatures and its length indicating the number of data points within that range. The chart is built using the p5.js library, which reads a CSV file from a GitHub repository and preprocesses the data into buckets. The code uses `loadTable` to fetch the data, `createCanvas` to set the drawing space, and `rect` and `line` functions to render the bars and axes.

PPeter Gish

78% match

Loading thumbnail…

p5 Climate Change Heat Map

This visualization displays monthly average temperatures for seven randomly selected countries as a heat map, using color-coded rectangles arranged in a grid. Each row represents a country, each column a month, with color intensity reflecting temperature relative to the global dataset minimum and maximum. Built with p5.js, it loads CSV data from a GitHub repository via `loadTable`, processes the data in `preprocess()`, and renders the heat map using `rect()` and HSL color encoding. Hovering over a cell displays the country name and temperature value in a popup, while axis labels and a title provide context.

PPeter Gish

76% match

Loading thumbnail…

Fork of Climate change

This bar chart visualizes the distribution of global land temperatures by country, showing the frequency of data points across temperature ranges in Celsius. Using the p5.js library, the sketch loads CSV data from a GitHub repository and sorts the raw temperature values into 2,500-point buckets. The preprocessing function calculates bucket spans and counts, then renders horizontal bars with labeled axes, tick marks, and a rotated y-axis title. The visualization reveals the overall shape and concentration of temperature records across different climate zones.

Vvenkatajayanth03

71% match

Loading thumbnail…

Climate change

This visualization displays the distribution of global land temperatures using a horizontal bar chart built with the p5.js library. The chart groups temperature readings from the GlobalLandTemperaturesByCountry dataset into buckets, showing the frequency of data points across temperature ranges. Each bar’s length represents the count of readings in that bucket, while the y-axis labels the temperature spans in Celsius. The code processes the CSV data in `preload()` and `preprocess()`, then renders the chart with p5.js drawing functions like `rect()` and `line()`.

SSamanvitha1

70% match

Loading thumbnail…

Strip Plot

A strip plot displays the average temperature of ten cities for each month of 2016, with each month’s ten readings jittered horizontally to reduce overplotting. The visualization uses the p5.js library, loading a CSV dataset from a GitHub Gist via the `loadTable` function, and renders circles on a canvas with hover tooltips showing exact temperature and month values. Axis labels and tick marks for temperature and month are drawn manually, with random offsets precomputed in a `randomNum` array to distribute points.

AAllen Ho

70% match

Loading thumbnail…

A2 - Temps (Heatmap)

This heatmap visualizes average monthly temperatures for seven U.S. states in 2016, using a yellow-to-orange color scale where warmer temperatures appear brighter. The p5.js sketch loads CSV data via `loadTable`, processes it in `preload()` and `setup()`, and renders colored squares for each state–month combination on a Canvas. A legend explains the color range, and axis labels identify states and months. The code uses p5.js drawing functions like `fill()` and `square()` to construct the grid.

Cctan13@dons.usfca.edu

66% match

Loading thumbnail…

Dot Plot

A dot plot visualizes the average impact magnitude of earthquakes across different locations, filtering to show only those with magnitudes above 4.0 and highlighting the highest values in black. The p5.js sketch loads earthquake data from a CSV file, computes averages per location, and renders labeled dots along a scaled axis in a canvas. It uses `createCanvas`, `loadTable`, and `point` to draw the plot, with horizontal grid lines and tick marks for magnitude values ranging from 4.0 to 5.0.

CChandana Srinivas

66% match

Loading thumbnail…

Temperature: from ObservableHQ

The visualization displays monthly global temperature anomalies from 1880 onward as a dot plot, with a horizontal reference line at zero and a moving average line. The dots are colored using a blue-red scheme to encode anomaly values. Built with Observable Plot and D3, the code loads data from `gistemp.csv`, converts dates and values, and uses `Plot.plot`, `Plot.dot`, `Plot.lineY`, and `Plot.ruleY` to render the chart with labeled axes and grid lines.

SStefan Apostol

65% match