Obesity values vs Countries

100%

Obesity values vs Countries

✓ Published1🌍 Public

Last edited Sep 19, 2019

Created on Sep 10, 2019

A bar chart shows obesity rates for sixty countries, highlighting that the Cook Islands has the highest value and Burundi the lowest. The chart encodes country on the x-axis, sorted by descending rate, and the obesity value on the y-axis. It is built with the vega-lite-api, using `vl.markBar` and `vl.encode` with `fieldQ` and `fieldN`, and loads data from a CSV via d3’s `csv` function. The visualization is rendered as an SVG with a custom config and tooltip handler.

AI-generated description

A visualization for Global Obesity Rates 2014 using the vega-lite-api.

This viz trys to display the relation between obesity rates and the corresponding countries.

cook islands has the highest obesity rate, on the other hand, burundi has the lowest rate.

MIT Licensed

Similar vizzes

Loading thumbnail…

Most Obese Countries as of 2014

This visualization displays the 80 countries with the highest obesity rates in 2014, ranked from highest to lowest using horizontal bars. The data is loaded from a CSV file via the `d3.csv` method, then sorted with `d3.descending` before being sliced to the top 80 entries. The chart is built using the Vega-Lite API (via `vega-lite-api`), with `markBar`, `vl.y().fieldQ('value')`, and `vl.x().fieldN('Country').sort('-y')` for encoding. Custom axis and label styling is applied through the `config` object.

CCurran Kelleher

84% match

Loading thumbnail…

Most Obese Countries as of 2014

A horizontal bar chart ranks the 80 most obese countries by obesity rate in 2014, using country names on the x-axis and numeric values on the y-axis. The data, loaded via `d3.csv`, is sorted in descending order with `d3.descending` before slicing to ensure an accurate top list. The visualization is built with the vega-lite-api library, configured with `vl.markBar()`, and rendered as an SVG through `vega` and `vega-lite` with a custom dark theme.

Aasujata-1234

84% match

Loading thumbnail…

Most Obese Countries as of 2014

A horizontal bar chart ranks the 80 countries with the highest obesity rates as of 2014, with each bar's length proportional to the national obesity percentage. The data is sorted in descending order before slicing, ensuring the top countries appear accurately at the top of the chart. Built with the vega-lite-api and rendered as SVG, the visualization uses d3.csv to load the dataset and d3.descending for sorting, while the tooltip and axis configurations come from the vega-tooltip handler and custom config.js settings.

Mmkt-ds

83% match

Loading thumbnail…

Most Obese Countries as of 2014

This bar chart shows the 80 countries with the highest obesity rates in 2014, sorted in descending order. The visualization uses the Vega-Lite API with d3.csv to load the data, then d3.descending to sort it before slicing the top 80 records. The chart encodes country names on the x-axis and obesity rate on the y-axis, with tooltips for each bar. Custom configuration improves readability by adjusting axis tick colors, label font size, and title styling via the vega-tooltip handler.

Aasujata-1234

83% match

Loading thumbnail…

Making a Bar Chart

This bar chart displays the obesity rates of the most affected countries using 2016 data from a Wikipedia list. It renders horizontal bars for each country, with the length of each bar proportional to the obesity rate percentage. The visualization uses D3 v7 with `scaleLinear` for the x-axis, `scaleBand` for the categorical y-axis, and `axisLeft`/`axisBottom` for the axes. The SVG elements are styled with `fill: steelblue`, and the data is loaded from a local `data.csv` file.

JJadeITNT

78% match

Loading thumbnail…

World Adult Obesity

A heat map of global adult obesity rates uses color-coded countries on a world map to show prevalence by year. Users can scrub through available years for smooth transitions or input a specific year, with pop-ups on hover providing country details and a legend describing the color scale. It is rendered as SVG via D3 v5, using d3.min.js for selection and shape drawing, with data loaded from a static CSV.

Aacb30

69% match

Loading thumbnail…

Bar Chart

This horizontal bar chart ranks the top 10 countries by diabetes cases, using a green bar length to encode the numeric value from a local CSV file. The chart applies a linear scale for case counts and a band scale for country names, with axes labeled accordingly. Built with D3 v5, the code loads data via `d3.csv`, sorts and slices it, and renders SVG rectangles using `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`.

VVinay Vemuri

66% match

Loading thumbnail…

Obesity Among Adults

This example demonstrates how to load and inspect a dataset on adult obesity rates by country, displaying basic statistics about the data file. The visualization presents three key metrics: the file size in kilobytes, the number of rows, and the number of columns. Using D3.js version 5.11, the code loads a TSV file from a remote URL via `d3.tsv`, formats the data with `d3.tsvFormat`, and calculates the byte length of the formatted string. The resulting information appears in a large `<pre>` element. The dataset originates from Kaggle, covering obesity rates from 1975 to 2016.

DdaojunL

66% match