Skip to main content
SimilarExport ZIP
100%

Fork 2

✓ Published0🌍 Public
SSeema Shrestha
Last edited Apr 16, 2024
Created on Apr 16, 2024

A scatter plot visualizes the relationship between GDP and CO2 emissions for ten major countries, with each point colored by country and hover interactions revealing exact values via tooltips. The chart uses D3.js v7 to load CSV data from GitHub, parse numeric values, and render SVG circles positioned by linear scales. Axes, tick formatting, and labels are generated with `d3.axisBottom` and `d3.axisLeft`, while a color ordinal scale assigns category colors to countries.

AI-generated description
MIT Licensed

Similar vizzes

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

Fork of ICE-7 Common Visualization Idioms

This example demonstrates a reusable scatter plot that visualizes the relationship between CO₂ emissions and GDP for six countries using data from a local CSV file. It employs D3 v7 with SVG rendering, implementing a `scatterPlot` function that accepts container, data, and variable parameters for reusability. The visualization uses `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` to create proportional scales and axes, with circles positioned via `attr` bindings. The code also clears previous SVG elements before re-rendering, ensuring clean updates without duplication.

Sskmriyaz0786@gmail.com
83% match
Loading thumbnail…

Carbon Emissions of Top 10 Highest GDP Countries

This scatter plot displays the relationship between GDP and CO2 emissions for the ten highest-GDP countries, with each circle colored by country and hover interactions revealing a tooltip with exact values. The visualization uses D3 v7 to load CSV data from a GitHub repository, applies linear scales to map GDP (in trillions) and CO2 emissions, and renders the axes and circles as SVG elements. Tooltip transitions and ordinal color scaling are implemented via d3.scaleOrdinal, and the data is parsed using regex to extract numeric values from formatted strings.

DDipesh
82% match
Loading thumbnail…

Fork of 6th visualisation 1

This scatter plot visualizes the relationship between population and GDP across countries, with each point colored by region and interactive tooltips showing country details. It uses D3 v7 to load CSV data from a GitHub repository, then renders an SVG chart with linear scales for both axes and an ordinal color scale based on region_id. The code employs d3.csv, d3.scaleLinear, d3.scaleOrdinal, d3.axisBottom, and d3.axisLeft to construct axes, circles, and a categorical legend, all within a responsive layout.

Cchintamanenithp@gmail.com
82% 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
82% match
Loading thumbnail…

Reusable Scatter Plot (CO₂ vs GDP, 2025)

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.

Vvunnamnandini13@gmail.com
81% match
Loading thumbnail…

Fork of Fork of Hello VizHub

This scatter plot visualizes the relationship between total tax rate and CO2 emissions for the top ten countries with the highest tax rates, using data from a GitHub-hosted CSV file. It renders an SVG chart with D3 v7, employing `d3.csv` to load the data, `d3.scaleLinear` for both axes, and `d3.axisBottom` and `d3.axisLeft` to draw the axes. Steel-blue circles mark each country, with text labels positioned adjacent to each point. The x-axis and y-axis are labeled “Total Tax Rate (%)” and “CO2 Emissions (kt)” respectively, providing a clear comparison of the two metrics.

DDipesh
81% match