Skip to main content
SimilarExport ZIP
100%

Climate Change

✓ Published0🌍 Public
SSai Sandhya Nannapaneni
Last edited Nov 27, 2024
Created on Nov 27, 2024

This visualization presents an interactive climate change dashboard blending a world map with a scatterplot of global average temperatures since 2000. The map uses data from a GeoJSON file, while temperature records come from an Our World in Data dataset. The plot encodes each year as a circle, with its horizontal position scaled by year and vertical position by temperature, colored by value. An input panel offers a mock linear prediction of future temperatures. The implementation relies on D3 v7 projections like `d3.geoNaturalEarth1` and `d3.geoPath`, alongside `d3.select`, `d3.json`, and `d3.csv`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Global Climate Temperature Trends

This interactive visualization displays global temperature anomalies from 1880 to 2020, with data relative to the 20th-century average. Users can toggle between line and area chart views, adjust line smoothing with d3.curveLinear, curveMonotoneX, or curveBasis, and filter by decade through a button panel. Hover tooltips reveal year-specific values, while a statistics sidebar calculates trends, volatility, and range using linear regression. The visualization uses D3.js v7 scales and axes within a React framework, with data loaded from a CSV file.

NNita
75% 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
75% match
Loading thumbnail…

Scatter Plot Temp Change

This scatter plot visualizes global temperature changes from 1880 to 2016, with each green circle representing the annual mean temperature deviation recorded by either the GCAG or GISTEMP source. The visualization uses d3.scaleLinear for both axes, d3.axisBottom and d3.axisLeft for tick marks, and d3.csv to load the dataset. SVG circles are positioned using the x and y scales, with a title and axis labels rendered as text elements.

Mmandadi1999
75% match
Loading thumbnail…

Cars Scatter Plot

This visualization displays global surface temperature changes since the 1700s using a heatmap of monthly temperature variances. Each cell represents a year and month, colored on a gradient from mint to dark red based on temperature deviation from a baseline. The code loads data from a JSON file via `d3.json`, renders SVG rectangles with scales created using `d3.scale.linear`, and includes interactive tooltips. The visualization also incorporates D3 axes, a time scale for month labels, and computed color thresholds for temperature ranges.

Vvaynexie
74% match
Loading thumbnail…

ClimateQ1

This reusable D3 scatter plot visualizes the relationship between per-capita CO₂ emissions and average temperature across countries, with each circle representing a data point. The chart uses d3.scaleLinear for both axes and d3.scaleOrdinal with d3.schemeTableau10 for color encoding. It includes gridlines, axis labels, and an interactive tooltip that appears on hover. The code defines a configurable scatterPlot function that selects a DOM element, appends an SVG canvas, and renders axes and circles using d3.axisBottom, d3.axisLeft, and standard SVG circle elements.

Vveginetiumeshchandra@lbrce.ac.in
73% match
Loading thumbnail…

World Map

This visualization displays temperature readings over time as a smooth, connected line chart. It uses a time-scaled x-axis and a linear y-axis, with data sourced from the Data Canvas Sense Your City dataset. The implementation leverages React for the component structure, d3.scaleTime and d3.scaleLinear for scaling, and d3.line with a natural curve to generate the path. The SVG rendering includes labeled axes and tick marks, while the use of a CSV loading function via d3.csv populates the chart.

GGregS1290
73% match
Loading thumbnail…

Global Temperature

This visualization shows the change in global, Northern Hemisphere, and Southern Hemisphere temperatures from 1880 to 2014, with each time series as a separate line. A color legend identifies the three regions. Built with D3 v5, it loads CSV data and uses `d3.scaleTime` and `d3.scaleLinear` for axes, while `d3.line` with `curveBasis` generates the paths. The chart renders as SVG, with axes and line styling defined in CSS.

Gglitched-potato
73% match
Loading thumbnail…

world map

This example visualizes temperature data from the Data Canvas Sense Your City dataset as a time-series line chart. The y-axis displays temperature values while the x-axis represents time, with the line connecting data points to show trends over the course of a week. Built with React and D3 v5, the chart uses D3’s `scaleTime` for the time axis, `scaleLinear` for the temperature axis, and `line` with `curveNatural` to draw the smoothed path. The visualization is rendered as an SVG, with axes and marks generated by custom React components, though the data file is loaded via `d3.json` from a GeoJSON URL, suggesting a possible mismatch with the scatter plot described in the README.

HHaris Vidimlic
73% match