Skip to main content
SimilarExport ZIP
100%

Customizing Axes

✓ Published1🌍 Public
Sslipperyd
Last edited Feb 21, 2020
Created on Feb 21, 2020
Forked from Making a Bar Chart

A horizontal bar chart displays the top ten most populous countries in 2018, with China and India leading by a significant margin. The visualization uses D3 v5 to load CSV data and render SVG elements, employing `scaleLinear` and `scaleBand` for positioning, and `axisLeft` and `axisBottom` for the axes. Custom tick formatting converts large numbers into abbreviated units (e.g., "B" for billions), while removed domain lines and styled gridlines highlight the data values.

AI-generated description

This bar chart shows the total population of the top 10 most populous countries. The data comes from the year 2018, source(...)

MIT Licensed

Similar vizzes

Loading thumbnail…

Customizing Axes

This bar chart displays the top 10 most populous countries using 2018 United Nations population estimates, with China and India leading by a wide margin. The example focuses on customizing D3 axes, removing default domain lines and using tick lines as horizontal gridlines. It employs `d3.csv`, `d3.scaleLinear`, `d3.scaleBand`, `d3.axisLeft`, and `d3.axisBottom`, with custom tick formatting that converts billions to abbreviated labels. The SVG rendering includes styled tick text, an axis label, and a chart title, all defined through CSS classes.

SScubaman911
93% 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
91% match
Loading thumbnail…

Customizing Axes

This visualization shows the ten most populous countries as a horizontal bar chart, using population data from the UN. The bars are sorted by population, with China and India dominating the chart. The example focuses on customizing both the x-axis and y-axis: the x-axis uses a tick format function to abbreviate large numbers (e.g., converting billions to "B"), while the y-axis labels are styled with custom tick text. The chart is rendered with SVG, using D3 v5’s `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` APIs, with data loaded via `d3.csv`.

Iianleekq
91% match
Loading thumbnail…

Customizing Axes

This example demonstrates a bar chart displaying the population of ten countries, including China and India, sorted by value, with customized axes. The chart uses D3 v5’s `scaleLinear` and `scaleBand` to map population counts and country names, while `axisBottom` and `axisLeft` render the axes. The x-axis applies a `tickFormat` with the `.3s` specifier to abbreviate large numbers. Data is loaded from a CSV file via `csv`, and the visualization is rendered as SVG rectangles with steelblue fills.

ZZY Huang
91% match
Loading thumbnail…

Customizing Axes - 072119

A horizontal bar chart displays the populations of the top ten most populous countries, with values scaled in thousands and formatted with custom ticks (e.g., "1.41B" for China). It uses d3.csv to load data, d3.scaleLinear and d3.scaleBand for positioning, and d3.axisBottom and d3.axisLeft for axes. The chart removes default axis domains, adds gridlines via tickSize, and includes custom axis and title labels. Data is rendered as SVG rectangles with steelblue fill.

Sshallowater
91% match
Loading thumbnail…

Customizing Axes

A horizontal bar chart displays the top 10 most populous countries using data from a CSV file. It maps population to bar width with a linear scale and country names to bar height using a band scale. The axes are customized with d3.axisBottom and d3.axisLeft; tick lines are removed, grid lines are added, and population values are formatted with d3.format to abbreviate billions as "B". The visualization is rendered as SVG with D3 v6.

WWayne716
91% match
Loading thumbnail…

05_Customizing Axes

This visualization shows the top 10 most populous countries based on 2018 United Nations estimates, with China, India, and the United States leading. It builds on a basic bar chart by customizing d3.axisBottom with tick formatting that converts large numbers to abbreviated labels, turning G into B for billions. The chart removes default domain lines and tick marks from both axes, adds a rotated title, and includes explanatory axis labels. Data is loaded from a CSV file and rendered as SVG rectangles using d3.scaleLinear for the population scale and d3.scaleBand for the country categories.

LLuiz Domingues
91% match
Loading thumbnail…

05_Customizing Axes

This visualization shows the top 10 most populous countries based on 2018 United Nations estimates, with China, India, and the United States leading. It builds on a basic bar chart by customizing d3.axisBottom with tick formatting that converts large numbers to abbreviated labels, turning G into B for billions. The chart removes default domain lines and tick marks from both axes, adds a rotated title, and includes explanatory axis labels. Data is loaded from a CSV file and rendered as SVG rectangles using d3.scaleLinear for the population scale and d3.scaleBand for the country categories.

LLuiz Domingues
91% match