ICE 6: Scatter Plot Showing Life expectancy vs Happiness Score Scatter Plot

100%

ICE 6: Scatter Plot Showing Life expectancy vs Happiness Score Scatter Plot

✓ Published1🌍 Public

Last edited Jun 25, 2022

Created on Jun 23, 2022

This scatter plot visualizes the relationship between life expectancy and happiness score for countries in the 2017 World Happiness Report, with each semi-transparent purple circle representing a country. The code uses D3 v5’s `csv` loader to fetch the dataset and `scaleLinear`, `extent`, `axisBottom`, and `axisLeft` to map the values and render axes with gridlines. The SVG rendering includes labeled axes and a title, while CSS controls circle opacity and text styling.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE 6: Scatter Plot Showing Life expectancy vs Happiness Score Scatter Plot

This scatter plot visualizes the relationship between life expectancy and happiness score across countries, with each circle representing a data point. The chart uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to map the CSV data onto an SVG canvas, with green circles and labeled axes. The code loads data from a GitHub-hosted CSV file, parses numeric fields, and renders a titled plot with grid lines and rotated axis labels. Happiness scores appear on the y-axis, while life expectancy spans the x-axis, revealing a positive correlation between the two metrics.

Rrallabandisushen@gmail.com

90% match

Loading thumbnail…

Life expectancy vs Happiness Score Scatter Plot

This scatter plot visualizes the relationship between life expectancy and happiness score from the 2017 World Happiness Report, sourced from Kaggle. Each green circle represents a country, plotted by its health life expectancy contribution against its overall happiness score. The visualization uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct the coordinates and axes, rendering as an SVG. The code loads data via `csv` from a VizHub dataset, applies numeric parsing, and styles points with opacity and a sans-serif font.

NNTCHANG1289

88% match

Loading thumbnail…

Life expectancy vs Happiness Score Scatter Plot with menus

This scatter plot displays the relationship between Life Expectancy and Happiness Score using data from the 2017 World Happiness Report on Kaggle. It shows how these two variables correlate across countries, with each circle representing a nation. The visualization uses d3.v5 with SVG rendering, employing scaleLinear for both axes and axisBottom/axisLeft for tick marks. The code loads CSV data, parses numeric values, and renders circles with fixed radius, green fill, and opacity, while a dropdown menu component is included but not implemented.

NNTCHANG1289

86% match

Loading thumbnail…

Happiness Level Plot

This scatter plot displays each country’s life satisfaction ranking against the year, from 2004 to 2016, using data from the World Happiness Report 2017. It is built with D3 v5 and renders as an SVG, with a time-scaled x-axis and a linear y-axis. The code uses `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` to construct the axes, and appends semi-transparent orange circles to represent data points. The CSV dataset is loaded via D3’s `csv` method, and the plot includes axis labels and a title.

CChooo4u

85% match

Loading thumbnail…

1027Happiness Level Scatter Plot

This scatter plot displays life satisfaction levels across various countries from 2004 to 2017, featuring interactive tools for exploration. Users can select different metrics from a dropdown menu to change the y-axis, and click legend items to highlight specific data points. The visualization, built with D3 v5, renders circles positioned by year and happiness score, with color encoding for countries. A tooltip reveals country and value details on hover, while the legend provides an interactive filter. Data is loaded from a remote CSV file sourced from the World Happiness Report.

KKeerthiKandadai

83% match

Loading thumbnail…

Chathurya ICE-6 Scatter Plot

This scatter plot visualizes the World Happiness Report dataset, showing the relationship between Positive Affect and Life Choices of people, with each point colored by country. The visualization uses circle marks to represent individual data points and includes a color legend to distinguish between countries. Built with D3 v7, the code imports from `d3-scale-chromatic` and `schemeCategory10` for the color scale, while the axes and legend are implemented in separate modules. The data is loaded from a local CSV file using `csvParse`, with numeric columns converted to proper data types before plotting.

CChathurya

83% match

Loading thumbnail…

Happiness Level Plot

This scatter plot visualizes self-reported life satisfaction across the world from 2004 to 2016, plotting happiness rank (lower is better) against each year. The code uses d3.csv to load data from a modified World Happiness Report 2017 dataset, then renders orange semi-transparent circles via SVG. Axes are generated with d3.axisBottom and d3.axisLeft, while d3.scaleTime and d3.scaleLinear map the data domain. The visualization includes a title and axis labels, with gridlines drawn by extending ticks across the plot area.

CChooo4u

83% match

Loading thumbnail…

1027Happiness Level Scatter Plot

This scatter plot visualizes self-reported life satisfaction across countries from 2004 to 2017, using data from the World Happiness Report. A dropdown menu lets users switch between different well-being metrics on the y-axis, while each circle represents a country-year observation colored by country. The visualization combines a time-based scatter plot with overlaid line charts showing trends per country. Clicking a country in the color legend filters both the points and lines, with a tooltip revealing exact values on hover. The code uses D3 v5 APIs including `scaleTime`, `scaleOrdinal`, `nest`, `axisBottom`, and `transition().duration()` for smooth animations.

CChooo4u

83% match