Skip to main content
SimilarExport ZIP
100%

Yifu's Customized Bar Chart

✓ Published1🌍 Public
YYifu Chen
Last edited Dec 25, 2019
Created on Dec 25, 2019

This horizontal bar chart displays the population of the top ten most populous countries, using data from the United Nations Population Prospect 2017. The visualization ranks countries along the y-axis, with bars extending rightward proportionally to population values. Built with D3 v5, the code uses `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render SVG elements. The chart applies custom tick formatting to abbreviate population numbers, removes default axis lines, and styles the bars with a steelblue fill against a light green background.

AI-generated description

Yifu's simple bar chart

I created the visualization following this tutorial: https://www.youtube.com/watchv=_8V5o2UHG0E&t=1220s

Data source: Data source is United Nations Population Prospect 2017

Dec. 24, 2019

MIT Licensed

Similar vizzes

Loading thumbnail…

Yifu's Customized Bar Chart

This horizontal bar chart displays the population of the top ten most populous countries, using data from the United Nations Population Prospect 2017. The visualization ranks countries along the y-axis, with bars extending rightward proportionally to population values. Built with D3 v5, the code uses `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render SVG elements. The chart applies custom tick formatting to abbreviate population numbers, removes default axis lines, and styles the bars with a steelblue fill against a light green background.

YYifu Chen
100% match
Loading thumbnail…

Yifu's Scatter Plot

This scatter plot displays the population of the top ten most populous countries, with each circle representing a country’s total population. The chart uses a linear scale for the x-axis and a point scale for the y-axis, with axis labels and a title. Built with D3 v5, it loads data from a CSV file using `d3.csv`, applies `scaleLinear` and `scalePoint`, and renders SVG circles via `selectAll('circle').data().enter().append()`. The data originates from the United Nations Population Prospect 2017.

YYifu Chen
89% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The visualization uses D3 v5 with an SVG rendering approach, employing `scaleLinear` for the population axis and `scaleBand` for country categories. It customizes axes with `axisLeft` and `axisBottom`, applies a custom tick formatter that abbreviates large numbers, and includes axis labels and a title. Population values are loaded from a CSV file and multiplied by 1,000 before plotting.

Ssuyunlan
86% match
Loading thumbnail…

Customizing

This bar chart displays the population of the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The visualization uses D3 v5 with an SVG rendering approach, demonstrating custom axes through the `axisBottom` and `axisLeft` APIs. It employs `scaleLinear` and `scaleBand` for positioning, while formatting tick labels with `format('.3s')` and converting "G" to "B" for billions. The chart includes a title, axis label, and styled grid lines, with all data loaded from a local CSV file.

Wwen787
86% match
Loading thumbnail…

Making a Bar Chart

This bar chart visualizes the top 10 most populous countries in 2018, using data from the United Nations World Population Prospects 2017. It demonstrates customized D3 v5 axes, including a formatted linear scale for population values with tick marks that abbreviate numbers (e.g., "B" for billions) and a band scale for country names. The chart is rendered as an SVG with steelblue bars, and the code uses D3 methods like `scaleLinear`, `scaleBand`, `axisBottom`, `axisLeft`, and `csv` to load and parse the data.

TTiffany Wu
86% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays the population of the top 10 most populous countries, using 2018 estimates from the United Nations World Population Prospects. The code demonstrates customizing D3 axes using `d3.axisBottom` and `d3.axisLeft`, with tick formatting via `d3.format` to abbreviate large numbers. It loads data from a CSV file with `d3.csv`, scales bars with `d3.scaleLinear` and `d3.scaleBand`, and renders the chart as SVG. The chart includes a title, axis labels, and grid lines, all styled with steelblue bars.

YYIN Wanxuan
86% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays the population of the top 10 most populous countries, using 2018 estimates from the United Nations World Population Prospects. The visualization encodes country names on the y-axis with d3.scaleBand and population values on the x-axis with d3.scaleLinear, rendering rectangular bars as SVG elements. The code loads data from a CSV file, converts populations to absolute numbers, and generates axes using d3.axisLeft and d3.axisBottom. Bars are filled with a steelblue color via CSS, and the chart includes margins for clear label placement.

Yyejichun@naver.com
86% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays the population of the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects 2017. It highlights the population values with a linear scale for the x-axis and a band scale for the y-axis, using custom tick formatting to abbreviate large numbers. The visualization uses D3 v5 with SVG rendering, employing `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to construct the chart. Data is loaded from a CSV file, and the code demonstrates custom axis styling and removal of default domain lines.

HHF Cheng
86% match