Skip to main content
SimilarExport ZIP
100%

Customizing Ranking of German Companies

✓ Published1🌍 Public
Mmimatador
Last edited Feb 6, 2019
Created on Feb 6, 2019

This example demonstrates the ranking of the 50 largest German companies by revenue, displayed as a horizontal bar chart. The chart uses a linear x-axis for revenue in billions and a categorical y-axis for company names, with bars drawn as SVG rectangles. The D3 v5 implementation builds the visualization using `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`, loading data from a semicolon-delimited CSV file. The data originates from German Firm Statistics 2017.

AI-generated description

This data is available at German Firm Statistics 2017 blablabla...

MIT Licensed

Similar vizzes

Loading thumbnail…

Customizing Ranking of German Companies

This visualization shows the top German companies ranked by revenue in 2017, with each company represented as a horizontal bar ordered by sales figures. The chart clearly displays the revenue hierarchy, from Volkswagen at the top to HeidelbergCement at the bottom. The code uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` functions to construct the SVG bar chart. Data is loaded from a semicolon-delimited CSV file using `dsv`, with revenue values parsed and scaled to billions.

JJayetsu
92% match
Loading thumbnail…

Ranking of German Companies

This bar chart ranks the 50 largest German companies by revenue in billions of euros, using a horizontal layout with company names on the y-axis and revenue on the x-axis. The visualization is built with D3 v5, employing `scaleLinear` for the quantitative axis and `scaleBand` for the categorical company names, rendered as SVG rectangles filled with steelblue. Data is loaded from a semicolon-delimited CSV file via `dsv`, with revenue values parsed as numbers before binding to the scales. The chart includes left and bottom axes generated by `axisLeft` and `axisBottom`, with margins and padding applied to the band scale for readability.

Mmimatador
89% match
Loading thumbnail…

Customizing Axes

This example demonstrates a racing bar chart that ranks the top 10 countries by GDP each year, with bars and labels animating to reflect changing positions. The visualization uses D3.js (v5) and SVG, with bars vertically reordering via a linear scale based on rank, while the horizontal axis uses a linear scale for GDP values. Data is loaded from a CSV file using `d3.csv`, and transitions are animated with `transition.duration`. The bar heights are set via `d3.scaleBand`, and the axis is customized with a tick formatter that converts numbers to billions.

Iinroadings
73% match
Loading thumbnail…

Customizing Axes

A bar chart race animates the yearly brand values of the world’s most valuable companies, as listed in the data.csv file. The visualization uses D3 v5 with SVG and transitions to dynamically rescale the x-axis to fit the top-ranked value. It customizes axes by styling tick text and lines via CSS, and employs `d3.create`, `svg.transition`, and `d3.easeLinear` to orchestrate the sequential updates.

LLuciano McSilva
71% match
Loading thumbnail…

company list

This example displays a horizontal bar chart of the top 11 companies from a dataset titled “Famous Sports in 2021,” ranked by their serial number. The visualization uses React with hooks to fetch CSV data via d3.csv, then renders SVG rectangles whose lengths encode the serial number values. D3 scales, including scaleBand and scaleLinear, position the bars, while custom tick marks and labels are drawn manually rather than using d3.axisBottom or d3.axisLeft. The chart is styled with a purple fill for each bar.

NNaimisha-M
71% match
Loading thumbnail…

Data Visualization - ICE-6 - Bar chart

This bar chart displays the revenue of the world’s top 10 biggest companies in billion dollars, sourced from a CSV file. It highlights how custom D3 axes can be styled with red gridlines, blue tick labels, and adjusted tick font sizes. The visualization is built with React and D3 v5, using `scaleBand` for the y-axis, `scaleLinear` for the x-axis, and rendering rect elements in SVG. Axes are manually constructed by mapping tick values, avoiding the default axis generators.

Ssuchitra2602
70% match
Loading thumbnail…

Data Visualization - ICE-6 - Bar chart

This horizontal bar chart displays the top 10 companies by revenue in billions of dollars, sourced from a CSV file. Each bar’s length is proportional to the revenue value, scaled using `d3.scaleLinear`, while company names are positioned with `d3.scaleBand`. The chart renders as an SVG with React, using `d3.csv` to load data and a `useEffect` hook to fetch and parse it. Axis ticks and gridlines are drawn with `d3.axisLeft` and `d3.axisBottom` logic, and red fills highlight the bars.

Ssuchitra2602
70% match
Loading thumbnail…

Making a Bar Chart

This example shows a horizontal bar chart of the top 10 most valuable companies, with market values in billions and a green axis label and title. It uses d3.csv to load data, d3.scaleLinear and d3.scaleBand for positioning, and d3.axisLeft and d3.axisBottom to render axes. The chart is drawn as SVG rectangles, with the y-axis line and ticks removed, and the x-axis tick format converts values from gigabytes to billions. A React starter is also referenced in the README, though the main implementation relies on plain D3 v5.

Aamiralitah
70% match