Skip to main content
SimilarExport ZIP
100%

Reusable Scatter Plot (CO₂ vs GDP, 2025)

✓ Published0🌍 Public
Vvunnamnandini13@gmail.com
Last edited Oct 26, 2025
Created on Oct 26, 2025
Forked from HTML Starter

This reusable scatter plot compares GDP per capita against CO₂ emissions for countries in 2025, with circle size encoding population and color distinguishing regions. Built with D3 v7, the chart renders as SVG and uses d3.scaleLinear, d3.scaleSqrt, and d3.scaleOrdinal to map data dimensions. Interactive tooltips appear on mouseover, showing country details such as renewable energy percentage, while data is loaded from a CSV file.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

GDP vs CO₂ Scatter Plot — 2025

This scatter plot visualizes the relationship between GDP per capita and CO₂ emissions for countries in 2025, with each point’s color indicating the region (Asia, Europe, Americas, Africa, Oceania) and its size encoding population. Built with D3 v7, the chart maps GDP to the x-axis, CO₂ emissions to the y-axis, and uses a square-root scale for point radii. The data is loaded via `d3.csv` from a GitHub gist, and the visualization features a grid, axis labels, and region color coding, all rendered in SVG with hover tooltips.

Vvunnamnandini13@gmail.com
89% match
Loading thumbnail…

Drawing a Scatterplot

This scatterplot shows the relationship between GDP per capita and CO2 emissions per capita for countries in 1995, with circle size encoding population. It uses d3.csv to load World Bank data and d3.scalePow and d3.scaleSqrt to map values. The SVG visualization includes clickable country nodes, each with a labeled circle, and displays axes with tick marks created using d3.axisBottom and d3.axisLeft.

ZZhengyan Yu
86% match
Loading thumbnail…

scatter plot

This scatter plot shows the relationship between GDP and CO₂ emissions for countries in 2020, with circle size encoding population and color highlighting China, the United States, and India. Hovering over a point reveals a tooltip with country details. Built with D3 v7, the visualization uses d3.tsv for data loading, d3.scaleLinear for axes, d3.scaleSqrt for sizing, and d3.axisBottom/axisLeft for rendering SVG axes with animation on tooltip transitions.

Bbadrinath888@gmail.com
85% match
Loading thumbnail…

interactive scatter

This interactive scatter plot visualizes the relationship between CO2 emissions and GDP for over 190 countries, with each circle representing a nation. The chart uses D3's `scaleLinear` for both axes, and employs `axisBottom` and `axisLeft` for custom tick marks and labels. The data is loaded from a local CSV file using `csv()`. The code includes commented-out instructions for using `scaleLog` to switch to a logarithmic scale, though the active visualization uses a standard linear scale for both variables.

Ookahne@gmail.com
85% match
Loading thumbnail…

Area Chart (CO₂ vs GDP-sorted Countries, 2025)

This area chart displays CO₂ emissions across countries sorted by GDP per capita for 2025, using a monotone-curved blue fill. The visualization loads CSV data from a GitHub gist via `d3.csv`, then applies `d3.scalePoint` for the categorical x-axis and `d3.scaleLinear` for the y-axis. The `d3.area()` generator with `curveMonotoneX` renders the shaded region, while SVG axes with rotated country labels handle the presentation.

Vvunnamnandini13@gmail.com
83% match
Loading thumbnail…

CO2 vs Population Scatter Plot

This interactive scatter plot displays the relationship between population and CO2 emissions for various countries over time, with a year slider controlling which time slice is visible. Each country is represented as a circle, sized by CO2 per capita and colored by country, with a tooltip showing precise values on hover. The visualization uses D3 v7 with `d3.csv` to load data, `d3.scaleLinear` and `d3.scaleSqrt` for axes and sizing, and `d3.axisBottom`/`d3.axisLeft` for chart axes. SVG rendering places circles, axes, and a country legend, while the slider input triggers a complete redraw of the chart elements for each selected year.

Ssrisailapu.rc@gmail.com
83% match
Loading thumbnail…

scatter plot practice

This example displays a scatter plot that maps each country’s GDP on the x-axis against its CO2 emissions on the y-axis, using static data from a CSV file. The visualization uses React with d3.v6 to create an SVG chart, employing `d3.scaleLinear` for both axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and `d3.csv` for data loading. Circles represent countries with a fixed radius of 10 pixels, colored in green, and hover events log data to the console. The chart is rendered within a specified margin and width, ensuring a clean layout.

Ookahne@gmail.com
82% match
Loading thumbnail…

Drawing a Scatterplot

This visualization shows a scatterplot of 1995 World Bank data, plotting GDP per capita on the x-axis against CO2 emissions per capita on the y-axis, with circle size encoding population. Each country is rendered as a labeled SVG group with a circle and text label. The code uses `d3.csv` to load the data, `d3.scalePow` with an exponent of 0.5 for both axes, `d3.scaleSqrt` for sizing circles, and `d3.axisBottom`/`d3.axisLeft` to draw the grid. Clicking a country highlights it with a red stroke via the `classed` method.

ZZhengyan Yu
82% match