Skip to main content
SimilarExport ZIP
100%

Customizing Axes

✓ Published2🌍 Public
Ccledevoute
Last edited Jun 17, 2020
Created on Jun 17, 2020
Forked from Making a Bar Chart

This bar chart displays the top 10 most populous countries, based on 2018 estimates from World Population Prospects 2017. The visualization customizes axes by removing default domain lines and tick marks on the y-axis, while formatting the x-axis labels to abbreviate numbers (e.g., “1.42B”). Built with D3 v5, it uses `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft`, with data loaded via `csv`. Population values are multiplied by 1000, and the x-axis tick format converts “G” to “B” for billions.

AI-generated description

THis bar chart shows population of the top 10 most populous countries. The data comes from the year 2018 estimate in [World Population Prospects 2017]

MIT Licensed

Similar vizzes

Loading thumbnail…

Customizing Axes

This bar chart displays the population of the top 10 most populous countries, using 2018 estimates from the United Nations World Population Prospects. The chart customizes its axes by removing default domain lines and tick marks, applying a custom tick format that abbreviates large numbers (e.g., converting billions to "B"), and adding descriptive axis labels. Built with d3.v5, it uses `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render the SVG, with data loaded from a CSV file.

Ddtdenver
96% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries using 2018 population estimates from the United Nations World Population Prospects. It demonstrates customization of D3 axes by removing default axis lines, styling tick marks, and applying a custom tick format that converts values to abbreviated numbers with 'B' for billions. The visualization uses D3's `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` APIs, with SVG rendering. Population data is read from a CSV file, multiplied by 1000, and mapped to bar widths.

PPezanne Khambatta
96% match
Loading thumbnail…

Customizing Axes

This bar chart displays the populations of the top 10 most populous countries, using 2018 estimates from the United Nations World Population Prospects, with data loaded from a CSV file. The visualization highlights customized D3 axes: the y-axis omits its domain and tick lines, while the x-axis uses a tick formatter to abbreviate values like billions and removes its domain line. Built with D3 v5, it employs `scaleLinear` for the x-axis, `scaleBand` for the y-axis, and `axisBottom` with `tickSize` to extend grid lines across the chart. Rendered as SVG, the bars use steelblue fills, and axis labels and titles are styled via CSS.

CCleber Rojas
96% match
Loading thumbnail…

Customizing Axes

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 customizes both axes: the y-axis removes domain and tick lines for a cleaner look, while the x-axis applies a custom tick format that converts large numbers into abbreviated labels and draws grid lines across the chart. Built with d3.v5, the code uses d3.scaleLinear, d3.scaleBand, d3.axisBottom, and d3.axisLeft to render SVG elements. Population values are multiplied by 1000 during data loading from a CSV file.

Wwishcsdev
96% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries using 2018 estimates from the United Nations World Population Prospects. The visualization customizes its axes: the y-axis removes domain and tick lines, while the x-axis uses a tick format that abbreviates numbers (e.g., converting G to B) and adds a population label. Built with D3 v5, it uses `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` within an SVG rendering. The chart also includes grid lines via `tickSize(-innerHeight)` and a title.

MMargarita Chernetski
96% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries using 2018 population estimates from the United Nations World Population Prospects, with a linear scale for population and a band scale for country names. The visualization customizes D3 axes by removing domain lines, styling tick marks in red, and adding labels for both axes and a title. It uses d3.csv to load data, d3.scaleLinear, d3.scaleBand, d3.axisLeft, and d3.axisBottom, with tick formatting that converts billions to a readable "B" suffix.

Wwedbew
96% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries based on 2018 estimates from the United Nations World Population Prospects, with population values multiplied by 1,000 from the CSV data. The visualization demonstrates customized D3 v5 axes: a linear x-axis uses a tick formatter to abbreviate numbers (replacing ’G’ with ’B’) and includes an axis label, while the band y-axis removes its domain and tick lines for a cleaner look. The code relies on `scaleLinear`, `scaleBand`, `axisBottom`, `axisLeft`, and `format` from D3, rendering to SVG with margins, a title, and grid lines via negative tick sizes.

Hhamzsait
96% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries using 2018 estimates from the United Nations World Population Prospects, with population values formatted in billions. The example builds on a basic bar chart by customizing both axes: the left axis removes tick lines and domain, while the bottom axis uses a tick format that converts "G" to "B" for billions and spans the full inner height. The code employs D3 v5 modules including `scaleLinear`, `scaleBand`, `axisBottom`, `axisLeft`, and `format`, rendering SVG elements with custom axis labels and a title. Population data loads from a CSV file and is multiplied by 1000 to reflect actual figures.

Nncube-eng
96% match