Kudu

100%

✓ Published1🌍 Public

Last edited Jul 23, 2020

Created on Jul 20, 2020

Kudu is a data visualization that presents a bar chart of the ten most populous countries, using population data from a CSV file. The chart displays each country’s population as a horizontal bar, with axes labeled for continent and weight, though the rendered data is hardcoded. Built with D3 v5, it uses `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the SVG chart, while a separate DataTables table loads species information from a JSON file. The page also embeds a Google Map iframe.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Data as bar chart

A horizontal bar chart ranks the twenty most populous countries, showing population counts with steel-blue bars and labeled axes. Built with D3 v6, the visualization loads CSV data from Kaggle, maps populations to a linear scale and countries to a band scale, and renders the chart as SVG. The code uses `d3.scaleLinear`, `d3.scaleBand`, `d3.axisLeft`, and `d3.axisBottom` to construct the scales and axes.

Ccarbuncle-3djs

74% match

Loading thumbnail…

D3 Bar Chart

This bar chart displays the populations of the top 10 most populous countries, sorted vertically by country name. It uses D3 v5’s `csv` loader and `scaleLinear` and `scaleBand` to map population values and country categories, with axes generated by `axisLeft` and `axisBottom`. The SVG bars are rendered in steel blue, and population labels use the `format` function with abbreviated suffixes. Data comes from a local CSV file, and all rendering is done via SVG elements.

Kkkwyoung

74% match

Loading thumbnail…

Bar chart test

This bar chart displays the populations of ten countries, with each bar’s length encoding the population value in thousands. The visualization uses D3 version 5’s `scaleLinear` for the x-axis and `scaleBand` for the categorical y-axis, rendering rectangles into an SVG. Data is loaded from a CSV file and processed with `csv` and `select`, while the chart’s dimensions are taken from the SVG attributes.

Kketchuparegood

73% match

Loading thumbnail…

Bar Chart

This bar chart displays the population of ten countries, ranked along a vertical axis with horizontal bars representing each nation’s population in thousands. The visualization uses D3 v7 with `scaleLinear` and `scaleBand` to map population values to bar widths and country names to band positions, rendering an SVG that fills the browser window. Population data loads from a CSV file, and the chart includes axes via `axisLeft` and `axisBottom`, while bars are appended as `rect` elements with tooltips showing exact values.

SSubhamChhetri

73% match

Loading thumbnail…

The Barchart

This horizontal bar chart displays the populations of the ten most populous countries, using D3 v5 to map values to bar widths via `d3.scaleLinear` and `d3.scaleBand`. The SVG rendering includes gridlines, axis labels, and a title, with data loaded from a CSV file. Axis construction relies on `d3.axisLeft` and `d3.axisBottom`, while numeric tick labels are formatted using `d3.format`. The visualization is generated entirely client-side through D3’s data-join pattern.

JJezwin Varghese

73% match

Loading thumbnail…

Bar chart

This bar chart displays the population of the ten most populous countries, using horizontal bars ordered alphabetically by country name. The visualization loads data from a CSV file and renders it as SVG rectangles. It uses D3 v5 scales and axes, including `scaleLinear` for the population axis and `scaleBand` for the categorical country axis, with `axisLeft` and `axisBottom` for tick marks. The bars are styled steelblue via an external stylesheet.

BbeauMarko

73% match

Loading thumbnail…

d3.js

A horizontal bar chart displays population figures for ten countries, ordered from most to least populous. The visualization uses d3.v5 with SVG rendering, applying a linear scale for the population axis and a band scale for countries. It loads data from a CSV file, multiplies the population values by one thousand, and renders steel-blue rectangles. The chart includes left and bottom axes, with a margin-based layout within a 960 by 500 pixel viewport.

KkarthikLingeswaran

73% match

Loading thumbnail…

Bar chart

This bar chart displays the population of the ten most populous countries, with country names on the y-axis and population values on the x-axis. It uses d3.csv to load population data from a CSV file, d3.scaleLinear and d3.scaleBand for scaling, and d3.axisLeft and d3.axisBottom for ticks. The SVG renders rectangles with a steelblue fill, and axis labels include a formatted tick scale that converts billions. The chart applies margins and a title, with grid lines created via tickSize.

JJigs

73% match