Skip to main content
SimilarExport ZIP
100%

ClimateQ1

✓ Published0🌍 Public
Vveginetiumeshchandra@lbrce.ac.in
Last edited Oct 28, 2025
Created on Oct 28, 2025
Forked from D3 Starter

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.

AI-generated description
MIT Licensed

Similar vizzes

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

123

This sunburst chart displays global CO₂ emissions, with the top-emitting countries grouped by their respective regions. Using D3.js v6, the chart partitions a hierarchical dataset, rendering each segment as an arc whose angle and radius correspond to emission values. The visualization employs `d3.partition` and `d3.arc` for geometry, with regional colors from `d3.schemeCategory10` and country colors from `d3.schemePastel1`. Tooltips reveal exact emission figures, while an interactive legend color-codes both regions and individual countries.

Nnitinramagiri1@gmail.com
75% match
Loading thumbnail…

Scatter plot

A scatter plot displays CO2 emissions for top-ranking countries, mapping each country's total 2018 emissions in gigatons along a horizontal linear scale against a vertical point scale of country names. The visualization encodes data points as steelblue circles, with axes, gridlines, and labels styled via CSS. Built with D3 v6, it uses `csv` to load data, `scaleLinear` and `scalePoint` for positioning, and `axisBottom`/`axisLeft` for rendering axes, while `format` converts emission values to readable units. Data originates from UCSUSA's 2018 country emissions dataset.

Ccarbuncle-3djs
75% match
Loading thumbnail…

Q3 dinesh area chart D3.js!

This area chart visualizes global average temperatures from 2000 to 2024, showing a steady upward trend from 14.3°C to 15.6°C. The visualization loads data from a CSV file using d3.csv, then employs d3.area and d3.curveMonotoneX to render a smooth filled region with steelblue stroke. Axes are generated with d3.axisBottom and d3.axisLeft, while d3.scaleLinear maps years and temperature values. The SVG chart includes labeled axes and a title, all styled through a separate CSS file.

Ddineshsingiri18@gmail.com
75% match
Loading thumbnail…

Scatter Plot for Climate Data

This scatter plot visualizes the relationship between year and average temperature for China using the Climate Dataset, with each circle representing a data point. A dropdown menu lets users select a specific year, although the current rendering only displays China’s full time series. The visualization uses D3’s `scaleLinear` and `axisLeft` to construct axes, while custom label helpers from `@wyy-47/axislabels` add axis titles. The `viz` function draws a gray inner rectangle and semi-transparent circles with `selectAll` and `join`, updating the SVG directly.

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

Q2 dinesh Line chart D3.js!

This line chart visualizes the rise in average global temperature from 2000 to 2024, with yearly values plotted as a smooth monotone curve and marked by tomato-colored circles. The D3.js v7 code loads data from a CSV file using `d3.csv`, calculates linear scales with `d3.scaleLinear`, and renders axes via `d3.axisBottom` and `d3.axisLeft`. The chart is drawn as an SVG path with a steelblue stroke, while axes labels and a title are added as SVG text elements.

Ddineshsingiri18@gmail.com
75% match
Loading thumbnail…

ACTIVITY 6 Q3

This scatter plot visualizes the relationship between average temperature and humidity across ten cities, with each point colored by continent. The visualization uses D3 v7 to render SVG circles, with `d3.scaleLinear` for both axes, `d3.scaleOrdinal` for the categorical color mapping, and `d3.axisBottom`/`d3.axisLeft` for the tick marks. A static legend groups the five continents, while the data comes from a hardcoded array in the script.

Rragasrikakarla27@gmail.com
74% match