Skip to main content
SimilarExport ZIP
100%

World Happiness and Health Expenditures Correlation

✓ Published1🌍 Public
Mmkt-ds
Last edited Sep 27, 2019
Created on Sep 26, 2019

This visualization uses a line mark to plot the correlation between a country’s happiness score and its health expenditure per person, with points aggregated by average and the y-axis not starting at zero. It loads CSV data via `d3.csv` from a GitHub gist, then renders the chart using Vega-Lite API functions like `vl.markLine` and `vl.encode`, with a custom config for font sizes and axis styling. The code also includes a commented-out least-squares regression layer and tooltip setup via vega-tooltip, though the active view only displays the basic trend line.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of World Happiness and Health Expenditures Correlation

This visualization shows the correlation between national happiness scores and health expenditures per person, using a line chart to depict the trend across countries. It loads country-level data from a CSV file and renders it with Vega-Lite, using vega-lite-api and d3.csv for data fetching. The chart is customized with config.js for readability, and includes a layer for a least-squares regression line exported from lregression.js, which calculates the linear relationship fit to the data points.

SShan Gao
93% match
Loading thumbnail…

Linear Regression Line with D3.js

This visualization plots the correlation between a country's happiness score and its health expenditure per person, using a scatter plot of circles and an overlaid linear regression trendline. The data is loaded from a CSV file via `d3.csv` and rendered as SVG. The least-squares computation is performed manually in `index.js` to calculate slope, intercept, and r-squared, which are then used to draw the line via `d3.svg.line` and the `d3.scale.linear` axis scales.

Mmkt-ds
83% 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
81% match
Loading thumbnail…

Linear Regression Line with D3.js

This example shows the correlation between a country’s happiness score and its health expenditure per person using a scatter plot with a linear regression trendline. The visualization, built with D3.js v3 and SVG, plots each country as a green circle, with axes labeled in dollars and happiness scores, and overlays a blue best-fit line computed via a least-squares function that returns the slope, intercept, and R-squared value. Data is loaded from a CSV file hosted on GitHub, while the regression calculation uses native array methods like `map` and `reduce`.

KKeerthiKandadai
81% match
Loading thumbnail…

Vega-Lite API Template

This scatterplot displays the relationship between happiness score and logged GDP per capita for countries in the 2020 World Happiness Report, with point color encoding regional indicator and size representing healthy life expectancy. Tooltips reveal country name, happiness score, and GDP per capita on hover. The visualization is built using the vega-lite-api library, which wraps Vega-Lite’s declarative syntax, while D3’s `csv` function loads the external dataset. The chart automatically fits the window dimensions and uses a custom configuration to adjust axis and label styling.

AAnurag Desai
78% match
Loading thumbnail…

Vega-Lite API Template

This example visualizes the World Happiness Report 2020 data, plotting each country’s happiness score against its logged GDP per capita, with points colored by regional indicator and tooltips showing country details. Built with the Vega-Lite API, it uses `vl.markPoint()` and `vl.encode()` to define the scatter plot, while `d3.csv` loads the remote dataset. The visualization is rendered as an SVG via Vega and Vega-Lite, with a custom configuration for axis and label styling, and it fills the browser window using an autosize fit setting.

AAnurag Desai
77% match
Loading thumbnail…

GDP vs Health Expenditures with a regression line with and without logscale

This scatter plot compares GDP per capita to health expenditure per person across 156 countries, with each point sized by the World Happiness Score. A checkbox toggles between linear and logarithmic scales, recalculating the regression line in real time. The visualization uses d3.v4 with SVG rendering, d3.csv for data loading, and custom least-squares calculations for the regression. Data comes from the World Happiness Report via Kaggle.

Mmkt-ds
77% 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
76% match