Dashboard of World Population

100%

Dashboard of World Population

✓ Published5🌍 Public

Last edited Jan 28, 2020

Created on Jan 27, 2020

This dashboard visualizes the population of the top ten countries, showing both a bar chart and a scatter plot of the most recent population figures alongside an interactive line chart that displays population trends over time. Users can select a country from a dropdown menu to focus on its historical data. Built with D3.js, it uses `scaleLinear`, `scaleBand`, and `scalePoint` to render SVG elements, with animation supported. The population data originates from the World Bank and spans from 1960 onward.

AI-generated description

Simple dashboard consists of different charts showing the population of top ten countrie over the years.Data is taken from World Bank (https://data.world/worldbank/total-population-per-country/workspace/file?filename=POP_TOTAL_DS2_en_v2.csv)

MIT Licensed

Similar vizzes

Loading thumbnail…

Dashboard of World Population

The dashboard presents the total population of the top ten most populous countries, sourced from World Bank data, using three synchronized views: a bar chart, a scatter plot, and an interactive line chart. The line chart, built with D3's `scaleTime`, `scaleLinear`, and `scaleOrdinal`, allows users to select a specific country to view its population trend over time. The bar and scatter visualizations use `scaleBand`, `scalePoint`, and `scaleLinear` to encode country rankings and population values. All charts are rendered as SVG elements with a consistent color scale from `d3-scale-chromatic`, and the line chart includes animated transitions.

Mmab3105

95% match

Loading thumbnail…

Testing out dashboard stuff

A dashboard displays the population of the top ten most populous countries using a bar chart and a scatter plot, with data sourced from the World Bank. The bar chart uses `d3.scaleBand` and `d3.scaleLinear` to show population values, while the scatter plot employs `d3.scalePoint` for country categories. Both are rendered as SVG elements with D3 axes. A color legend is created with `d3.scaleOrdinal` and `schemeCategory10`. The visualization includes an interactive dropdown for selecting a country, though the line chart it targets is not currently rendered.

Wwmielke

86% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the population of the top 10 most populous countries using data from the 2017 World Population Prospects, with circles positioned on a linear x-axis and a point scale on the y-axis. The visualization loads data via d3.csv, applies a population multiplier, and renders an SVG using d3.scaleLinear, d3.scalePoint, d3.axisLeft, and d3.axisBottom. Gridlines extend across the chart, while tick labels use custom formatting to abbreviate large numbers.

DDaniel García

85% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the population of the top 10 most populous countries, using a bar chart layout with a linear scale for population and a band scale for country names. The data comes from the 2018 United Nations World Population Prospects. Built with D3 v5 and SVG rendering, the code uses d3.csv, scaleLinear, scaleBand, axisBottom, and axisLeft, with custom tick formatting that converts billions to a readable format and gridlines for the y-axis.

Mmallikgarjuna

84% match

Loading thumbnail…

Fork of Testing out dashboard stuff

A dashboard displays population data for the top ten countries, combining a bar chart and a scatter plot to rank and compare current populations. Built with D3.js, the visualization uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.scalePoint` for the charts, styled with SVG elements. Data is drawn from the World Bank's total population per country dataset, with axis ticks formatted using `d3.format`. The bar chart and scatter plot share the same color scheme, with a color legend for reference.

AAamir Hameed mir

84% match

Loading thumbnail…

Scatter Plot

This scatter plot shows the population of the top ten most populous countries, with each circle positioned along a linear population axis and a point scale for country names. The data comes from the 2017 World Population Prospects, multiplied by 1000 in the loader. The visualization uses D3 v7 with `scaleLinear`, `scalePoint`, `axisBottom`, and `axisLeft` to render the SVG chart, including gridlines and formatted tick labels that convert billions to the letter "B".

Aantoniojl@gmail.com

84% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the population of the top 10 most populous countries using data from the World Population Prospects 2017 estimate. Each circle’s horizontal position represents population on a linear scale, while vertical positioning uses a point scale for country names. The visualization is rendered with SVG via d3.v5, using `scaleLinear`, `scalePoint`, `axisLeft`, `axisBottom`, and `format` for tick labels. Gridlines and axis labels are styled with CSS, and the data is loaded from a CSV file.

IIan Perry

84% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the population of the top 10 most populous countries, using data from the 2017 United Nations World Population Prospects. The code uses D3 v5 to create an SVG visualization with circles positioned by d3.scaleLinear for population and d3.scalePoint for country names. Axes are customized with d3.axisBottom and d3.axisLeft, including tick formatting that converts values to billions. The chart includes axis labels and a title, with styling applied through external CSS.

Hhberrong

84% match