100%

World Happiness Scatter Plot

✓ Published0🌍 Public

Last edited Sep 17, 2024

Created on Sep 17, 2024

This scatter plot displays World Happiness data, mapping GDP per capita on the x-axis against flipper length on the y-axis. It uses D3.js and `viz.js` to render circles, with axis labels from `@curran/axis-labels`. The code loads data from `@mjmacgregor/worldhappiness`, featuring a grey inner rectangle and semi-transparent circles, though the y-axis value mapping appears counterintuitive for happiness data.

AI-generated description

A simple scatter plot with D3 showing the Penguins Dataset.

Challenge

Fork this viz
Modify it to show your data

MIT Licensed

Similar vizzes

Loading thumbnail…

World Happiness Scatter Plot

This scatter plot visualizes the relationship between GDP per capita and happiness scores using the World Happiness dataset. Each circle represents a country, positioned along the axes with a light gray background and semi-transparent points to reveal overlapping data. The visualization is built with D3.js, employing `scaleLinear` for both axes, `axisBottom` and `axisLeft` for tick marks, and custom `xAxisLabel` and `yAxisLabel` functions for clear labeling. Data points are rendered as circles with fixed radius and opacity, and the plot is designed to adapt to its container’s dimensions.

Ssamozarif@gmail.com

87% match

Loading thumbnail…

World Happiness Report

This visualization displays the relationship between a country’s happiness score and its GDP per capita, with each circle colored by whether the country is classed as the “happiest country.” Built with the vega-lite-api and D3 v5, it loads CSV data from a GitHub gist and renders a scatterplot using `vl.markCircle`. The chart applies custom axis and label styling from a shared config, uses a tooltip to show country names, and fits the view to the window dimensions.

Mmkt-ds

86% match

Loading thumbnail…

World Happiness Graph

A linked choropleth map and scatter plot visualize global happiness data, highlighting country scores, GDP per capita, and continent groupings. Interactive tooltips reveal detailed country information on hover. The map uses `d3.geoPath` with a `d3.geoEqualEarth` projection and `d3.scaleLinear` for color encoding. The scatter plot, built with `d3.axisBottom` and `d3.axisRight`, shows a log-scaled GDP axis against happiness scores, colored by continent using `d3.scaleOrdinal`. Data is rendered as SVG from loaded map and country datasets.

Kkaijavanzante@gmail.com

85% match

Loading thumbnail…

World Happiness Scatter Plot

This scatter plot shows the relationship between GDP per capita and healthy life expectancy across countries, revealing a positive correlation. The visualization uses d3.scaleLinear to map data dimensions to positions and d3.axisLeft for the y-axis. Data comes from the @mjmacgregor/worldhappiness package, rendered as semi-transparent circles on a gray background. The code employs axis label utilities from @curran/axis-labels to annotate both axes. This chart effectively demonstrates how wealthier nations tend to have higher life expectancy.

Mmacgregorm01@gmail.com

83% match

Loading thumbnail…

World Happiness Feature Relationships

This scatterplot explores relationships between world happiness indicators. Users choose which two metrics to plot against each other via dropdown menus, and can click legend items to highlight or isolate countries belonging to a specific region. The visualization uses D3 v5 to render SVG circles, animating their positions when the axis variables change. A tooltip appears on hover, showing the country's values. Data comes from a CSV file loaded with `csv()`. The code uses `d3.scaleLog`, `d3.extent`, and `d3.axisBottom`/`d3.axisLeft` to construct the log-scaled axes, and `d3.scaleOrdinal` with `d3.schemeCategory10` for color encoding.

Mmkt-ds

82% match

Loading thumbnail…

World Happiness Scatter Plot

This scatter plot visualizes the relationship between happiness ladder scores and generosity across countries, with each red circle representing a country based on data from the World Happiness Report 2019. The visualization uses d3.scaleLinear for both axes, d3.axisBottom and d3.axisLeft for tick marks, and SVG circles rendered via d3.select and .enter().append('circle'). The chart includes axis labels and a title, with data loaded via d3.csv from an external dataset, and styled through CSS for circle opacity and tick formatting.

SShanthi Acharya

81% match

Loading thumbnail…

Viz Project

This visualization explores global trends in the World Happiness Report by mapping each country’s life satisfaction against GDP per capita, with additional dimensions for social support, life expectancy, freedom, generosity, and corruption. Using D3 v4 with SVG and animation, the chart animates through years to reveal changes in the happiness landscape. Each country is represented as a circle, with its position encoding the relationship between GDP and the life ladder score, while size and color can encode additional variables. The visualization updates smoothly as the year changes, allowing users to compare how countries shift in relative happiness and economic standing over time.

CCJKraenzle

81% match

Loading thumbnail…

WHR2024

This scatter plot displays the relationship between GDP per capita and happiness scores for countries in the 2024 World Happiness Report. Each black circle represents a country, positioned by its logged GDP contribution and overall ladder score. Built with React and D3 v7, the visualization uses `scaleLinear` to map data coordinates and idempotent `select` operations to render circles and axes. The SVG rendering handles axis labels and margins through helper modules.

XXiaojun

81% match