Skip to main content
SimilarExport ZIP
100%

ICE-6(sai nitish)

✓ Published3🌍 Public
Ssainitish1999
Last edited Mar 7, 2022
Created on Mar 7, 2022

This horizontal bar chart displays the top 10 cosmetic products by revenue, using the d3.csv function to load data from a GitHub-hosted CSV file. It employs d3.scaleLinear and d3.scaleBand for the x and y axes, respectively, with d3.axisLeft and d3.axisBottom for tick marks. The chart customizes the x-axis tick format to replace 'G' with 'B' and removes default axis lines, while rectangles are colored red via CSS. The title and axis labels are added as SVG text elements. Data is rendered as an SVG graphic.

AI-generated description

This bar chart shows population of the top 10 most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017. It also demonstrates customization of D3 axes.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-6 Nithish Kumar

This horizontal bar chart displays the top cosmetic products by revenue, sourced from a CSV file. The visualization uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to map revenue values and product names, with SVG rectangles representing the bars. Axes are customized by removing domain lines and applying a tick formatter that converts large numbers to abbreviated units. The data is loaded via `d3.csv` and rendered with margins and labels for the title and x-axis.

NNithish Kumar
91% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This horizontal bar chart displays the top 10 cosmetic products by revenue, using data sourced from a CSV file hosted on GitHub. The visualization employs D3 v5's scaleLinear and scaleBand to map revenue values and product names, and renders the chart as SVG. The axes are customized using axisBottom and axisLeft, with tick formatting that converts large numbers to abbreviated forms and removes grid lines from the y-axis. The X-axis label and title are added via SVG text elements.

Ggayathri
90% match
Loading thumbnail…

ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue, using a horizontal layout where bar length represents dollar amounts. The data is loaded from a CSV file using D3’s `csv` function. The visualization customizes D3 axes: the y-axis removes domain and tick lines, while the x-axis uses a custom tick formatter that converts values from gigabytes to billions. The chart is rendered as SVG, with bars styled via CSS and axes created using `scaleBand`, `scaleLinear`, `axisLeft`, and `axisBottom`.

Sskambhore04
90% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue in dollars, using a horizontal layout with a linear x-scale and a banded y-scale. The visualization is built with D3 v5, leveraging the `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` APIs to render axes and bars. Data is loaded from a CSV file via `d3.csv`, with revenue values parsed as numbers. The chart includes axis labels and custom tick formatting that converts large numbers from G to B. The SVG canvas is 860 by 450 pixels, with margins arranged for clear presentation.

DDINESH SAI BOPPANA
90% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the revenue of the top 10 cosmetic products, sorted by product name on the y-axis and revenue in dollars on the x-axis. It uses D3 v5 APIs including `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render an SVG with custom tick formatting that abbreviates large numbers (e.g., converting billions to "B"). Data is loaded from a CSV via `d3.csv` and originates from a GitHub gist. The chart also removes default axis lines and includes custom labels for the title and x-axis.

Ssaiteja0725
90% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue, using a horizontal layout where product names are on the y-axis and revenue in dollars on the x-axis. The visualization is built with D3 v5, using `scaleLinear` and `scaleBand` to map data, and `axisLeft` and `axisBottom` for customized axes with tick formatting that converts large numbers to abbreviations. Data is loaded from a CSV file via `d3.csv` and rendered as SVG rectangles. The chart includes a title and axis label, with a light styling applied through external CSS.

Vvegurusaiprathyusha
90% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue, using a horizontal layout where product names are on the y-axis and revenue in dollars on the x-axis. The visualization is built with D3 v5, using `scaleLinear` and `scaleBand` to map data, and `axisLeft` and `axisBottom` for customized axes with tick formatting that converts large numbers to abbreviations. Data is loaded from a CSV file via `d3.csv` and rendered as SVG rectangles. The chart includes a title and axis label, with a light styling applied through external CSS.

Vvegurusaiprathyusha
90% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This horizontal bar chart displays the top 10 cosmetic products by revenue, with dollar amounts scaled along the x-axis and product names on the y-axis. It uses d3.csv to load data from a GitHub gist, then renders SVG rectangles with d3.scaleLinear and d3.scaleBand. Custom axes are built with d3.axisLeft and d3.axisBottom, including tick formatting that abbreviates large numbers with d3.format. The chart demonstrates margin-based layout and axis customization within an SVG canvas.

Iiamhassanrazaahr
89% match