Skip to main content
SimilarExport ZIP
100%

Customizing Axes

✓ Published1🌍 Public
AAustin0524
Last edited Oct 3, 2022
Created on Oct 3, 2022
Forked from Making a Bar Bhart

This horizontal bar chart displays the top 10 most populous countries, using a logarithmic-free linear scale for population values. The chart customizes the x-axis tick labels by reformatting large numbers (e.g., converting billions to "B" notation) and styling gridlines, while removing the y-axis domain and tick lines. It renders with D3 v7’s `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft`, reading population data from a CSV and drawing steel-blue rectangles via SVG.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Customizing Axes

A horizontal bar chart displays the top 10 most populated countries, with population values scaled in billions and abbreviated tick labels. The chart customizes its axes by removing domain lines and tick marks from the y-axis, while the x-axis uses a custom tick format that converts G (giga) to B (billion). Built with D3 v7, the visualization loads data from a CSV file and renders to SVG, using scales like `scaleLinear` and `scaleBand` alongside `axisLeft` and `axisBottom` to position bars and labels.

Ddaniel
94% match
Loading thumbnail…

Customizing Axes

A horizontal bar chart shows the top 10 most populous countries, with population values on the x-axis. The chart customizes the x-axis to format large numbers as billions (e.g., "1.42B") and removes the default axis lines and domain. It uses D3's `scaleLinear`, `scaleBand`, `axisBottom`, `axisLeft`, and `format` to handle scales, ticks, and number formatting. Data is loaded from a CSV file, and the SVG rendering is set up in `index.html` with `styles.css` controlling visual styling.

Zzlastefcia
94% match
Loading thumbnail…

Customizing Axes

This graphic shows a horizontal bar chart of the top ten most populous countries, with a linear x-axis formatted to display values in billions (e.g., "1.42B"). The y-axis lists country names without gridlines. Built with D3 v5 and rendered as SVG, the example uses `d3.scaleLinear`, `d3.scaleBand`, and `d3.axisBottom` to customize tick formatting and remove vertical gridlines on the categorical axis. Population data is loaded from a CSV and multiplied by 1000 before rendering.

Llinh-pham-nz
94% match
Loading thumbnail…

Customizing Axes

A horizontal bar chart displays the top 10 most populous countries, with population in millions on the x-axis and country names on the y-axis. The example highlights customized axes: the y-axis removes its domain and tick lines, while the x-axis uses a custom tick format that converts values from 'G' to 'B' for billions. D3's `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` are used, with data loaded from a CSV file.

AAndy Zhang
94% match
Loading thumbnail…

Customizing Axes

This bar chart shows the population of the top 10 most populous countries, with horizontal bars sorted by country name. The code uses d3.scaleLinear and d3.scaleBand for positioning, and d3.axisBottom with a custom tick formatter that converts large numbers to abbreviated units like "B" for billions. Axis gridlines extend across the plot area via negative tick sizes, while y-axis ticks and domains are removed for a cleaner look. Data loads from a CSV file and is multiplied by 1000 to reflect actual population figures.

TTsing
94% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries, with population values on the x-axis and country names on the y-axis. It uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` APIs, with a custom tick formatter via `format('.3s')` to abbreviate numbers. SVG rendering is used, drawing steel-blue bars with margins and a title. The data comes from a CSV file where population values are multiplied by 1000 during loading.

SSamuel Elbaz
94% match
Loading thumbnail…

Customizing Axes

This bar chart displays the population of the top 10 most populous countries, using a logarithmic-free linear scale for the x-axis and categorical bands for country names. The visualization customizes axes by removing default domain lines and tick marks, applying a tick format that abbreviates large numbers (e.g., "G" for billions) and adding styled axis labels and a title. Built with D3 v5, it uses `scaleLinear`, `scaleBand`, `axisBottom`, `axisLeft`, and `format` APIs, rendering to SVG with data loaded from a CSV file.

NNeepaB
94% match
Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries, with a horizontal layout and customized axes. The y-axis removes its domain and tick lines, while the x-axis uses a custom tick format that abbreviates large numbers and replaces 'G' with 'B' for billions. The chart is rendered with SVG using D3 v5, loading population data from a CSV file. The code uses `scaleLinear`, `scaleBand`, `axisBottom`, `axisLeft`, and `format` to create and customize the visualization.

VVeena Muralidharan
94% match